React学习计划-React16--React基础(三)收集表单数据、高阶函数柯里化、类的复习

1. 收集表单数据

包含表单的组件分类

  1. 受控组件——页面中所有输入类的DOM,随着输入,把值存维护在状态里,需要用的时候去状态里取值(推荐,避免了过渡使用ref
  2. 非受控组件——页面中所有输入类的DOM,现用现取
    受控组件示例:
    在这里插入图片描述
    非受控组件示例:
    在这里插入图片描述

2. 高阶函数

  1. 高阶函数:如果一个函数符合下面2个规范中的任何一个,那该函数就是高阶函数
    1. 若A函数,接收的参数是一个函数,那么A就可以称之为高阶函数
    2. 若A函数,调用的返回值依然是一个函数,那么A就可以称之为高阶函数
  2. 函数的柯里化:通过函数调用继续返回函数的方式,实现多次接收参数最后同意处理的函数编码形式

示例:
在这里插入图片描述
分析:我们在这个示例中可以看到onChange绑定事件是一个函数()=>this.handleChange('username', e),标签中呢不仅有事件,事件还绑定函数,函数的返回值也是个函数。

  1. 标签在渲染的时候呢,会执行onChange方法,这时候呢,执行了函数,返回了我们在类中定义的handleChangehandleChange方法还接收了两个参数,一个是我们想要修改的state的属性,另一个是标签的event对象,当我们在input标签里输入内容是,就会触发handleChange方法,
  2. 这种写法呢就属于标签内绑定函数,类中再定义函数。虽然能实现我们的功能,但是我们通常呢,会习惯性的只在标签内绑定一个类中定义的方法就可以了。不会在标签内绑定函数,而在类中呢再次定义函数,所以我们可以使用高阶函数来修改一下上述案例,就如下:

高阶函数——函数柯里化示例:
在这里插入图片描述

3. 类的复习

  1. 类中的构造器不是必须写的,要对实例进行一些初始化操作,如添加属性才写
  2. 如果A继承了B类,且A类中写了构造器,那么A类构造器中必须要调用super()
  3. 类中定义的方法,都是放在了类的原型对象上,供实例去使用

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/293580.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何进行USB丢弃攻击?

USB丢弃攻击,类似于一场表演艺术,您需要构建一个引人入胜的故事,激发目标的好奇心,让他们忽略基本的安全意识,插入您精心准备的USB设备! 本文章仅限娱乐,请勿模仿或进行违法活动! 一、选择放置…

账号多、用户咨询量大无法及时回复?「互动管理」助力高效经营!

随着互联网行业不断向纵深发展,内容形态与营销场景也更加多元化。越来越多的品牌跑步入场,深耕社媒营销,建立多平台营销矩阵,借助社媒平台的全域态势助力品牌增长。 据云略《2023品牌新媒体矩阵营销洞察报告》显示,目前…

【算法】使用二分查找解决算法问题:理解二分法思想,模板讲解与例题实践

文章目录 二分算法思想 / 性质 / 朴素模板二分查找的引入(二段性)704.二分查找 模板34.在排序数组中查找元素的第一个和最后一个位置 二分查找的前提条件 / 时间复杂度分析 算法题69.x的平方根35.搜索插入位置852.山脉数组的峰顶索引162.寻找峰值153.寻找…

CSS-计数器 counter-reset、counter-increment、counter-reset

计数器 CSS的计数器通过在 content 上应用 counter() 或 counters()函数来显示计数的。其中计数器是由counter-reset和counter-increment 来进行操作的。 counter-increment 语法 counter-increment参数1:计算器名称 该标识符由不区分大小写的字母 a 到 z&#xf…

【Qt之Quick模块】5. QML基本类型及示例用法

QML格式 QML基本类型 在 QML 中,有以下基本类型: int:整数类型。 Rectangle {function myFunction() {// 输出 debug 信息console.log("11 " (11));}Component.onCompleted: {myFunction();} }结果: 2. real&…

如何使用 Helm 在 K8s 上集成 Prometheus 和 Grafana|Part 1

本系列将分成三个部分,您将学习如何使用 Helm 在 Kubernetes 上集成 Prometheus 和 Grafana,以及如何在 Grafana 上创建一个简单的控制面板。Prometheus 和 Grafana 是 Kubernetes 最受欢迎的两种开源监控工具。学习如何使用 Helm 集成这两个工具&#x…

、写入Shellcode到注册表上线

其实本质就是将shellcode写入到注册表中,然后读取注册表中的shellcode,然后创建线程去执行shellcode。 如下图: 写入注册表shellcode 这里将shellcode写入到注册表中,在我们需要的时候再去读取然后执行。 这里用到如下两个Windows API函…

【2023最新版】Wireshark安装保姆级教程(超详细),及简单使用Wireshark抓包

一、官网下载地址: [wireshark](https://www.wireshark.org/) 二、步骤: 根据自己情况选择安装版本,我这里安装Windows版本 双击下载完成的应用 这里可以选择自己安装路径,也可以默认 下面点击Install后,安装过程中会跳…

【读论文】PSFusion

【读论文】Rethinking the necessity of image fusion in high-level vision tasks: A practical infrared and visible image fusion network based on progressive semantic injection and scene fidelity 介绍解决的问题网络架构整体架构稀疏语义感知分支( spars…

2023 下半年系统架构设计师学习进度

文章目录 复习计划:每周350分钟第一周(339分钟)第二周(265分钟)第三周(171分钟)第四周(214分钟)第五周(274分钟)第六周(191分钟&#…

【计算机系统结构实验】实验3 Cache性能分析

3.1 实验目的 加深对Cache的基本概念及其工作原理的理解; 掌握降低Cache不命中率的各种方法以及这些方法对提高Cache性能的好处; 理解常见替换算法(LRU与随机法)的基本思想以及它们对Cache性能的影响。 3.2 实验平台 实验平台…

Unity自带的NavMesh寻路组件

最近看了一下Unity自带的NavMesh寻路组件,先说一下基本的使用: 首先先把AI Navgation的package包给安装上。 给场景地图添加上NavMeshSurface组件,然后进行烘焙,烘焙出对应的场景地图文件。 给移动物体添加对应的Nav MeshAgent组…