ES 6 中的箭头函数及用法
ES6标准新增了一种新的函数:Arrow Function(箭头函数)。
主要的几种写法如下:
组成: 参数 => 语句,
参数不是1个: (参数,参数2)=>语句
语句不止一条: 参数 =>{语句1;语句2;return 返回值}
返回的对象格式: 参数=>({对象})
通常函数的定义方法
var fn1 = function(a, b) {
return a + b
}
function fn2(a, b) {
return a + b
}
使用ES6箭头函数语法定义函数,将原函数的“function”关键字和函数名都删掉,并使用“=>”连接参数列表和函数体。
var fn1 = (a, b) => {
return a + b
}
(a, b) => {
return a + b
}
当函数参数只有一个,括号可以省略;但是没有参数时,括号不可以省略。
// 无参
var fn1 = function() {}
var fn1 = () => {}
// 单个参数
var fn2 = function(a) {}
var fn2 = a => {}
// 多个参数
var fn3 = function(a, b) {}
var fn3 = (a, b) => {}
// 可变参数
var fn4 = function(a, b, ...args) {}
var fn4 = (a, b, ...args) => {}
箭头函数相当于匿名函数,并且简化了函数定义。箭头函数有两种格式,一种只包含一个表达式,省略掉了{ ... }和return。还有一种可以包含多条语句,这时候就不能省略{ ... }和return
() => return 'hello'
(a, b) => a + b
(a) => {
a = a + 1
return a
}
如果返回一个对象,需要特别注意,如果是单表达式要返回自定义对象,不写括号会报错,因为和函数体的{ ... }有语法冲突。注意,用小括号包含大括号则是对象的定义,而非函数主体
x => {key: x} // 报错
x => ({key: x}) // 正确
箭头函数中的this 与 普通函数中的 this 指向性问题
箭头函数中,this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this。正是因为它没有this,所以也就不能用作构造函数。所以在定义对象的时候,定义对象属性,里面的this指向的一般是全局,或者这个对象所在的那个环境中的this。
一个简单的例子,你就能明白了
var name = 'window';
var A = {
name: 'A',
sayHello1: () => {
console.log(this.name)
},
sayHello2(){
console.log(this.name)
}
}
A.sayHello1();// 输出的是 window
A.sayHello2();// 输出的是 A
ES 6 中的箭头函数及用法的更多相关文章
- 简单理解ECMAScript2015中的箭头函数新特性
箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...
- C语言中关于scanf函数的用法
scanf()函数的控制串 函数名: scanf 功 能: 执行格式化输入 用 法: int scanf(char *format[,argument,...]); scanf()函数是通用终端格式化 ...
- ES6中的箭头函数
关于函数表达式中的this:自动引用正在调用当前方法的.前的对象1.obj.fun()中的this fun中的this -> obj2.new Fun() Fun中的this -> 正在创 ...
- JavaScript中字符串分割函数split用法实例
这篇文章主要介绍了JavaScript中字符串分割函数split用法,实例分析了javascript中split函数操作字符串的技巧,非常具有实用价值,需要的朋友可以参考下 本文实例讲述了JavaSc ...
- C中的时间函数的用法
C中的时间函数的用法 这个类展示了C语言中的时间函数的常用的用法. 源代码: #include <ctime>#include <iostream> using name ...
- (转)Python中的split()函数的用法
Python中的split()函数的用法 原文:https://www.cnblogs.com/hjhsysu/p/5700347.html Python中有split()和os.path.split ...
- ES6箭头函数基本用法
ES6箭头函数基本用法 ``` window.onload = function(){ alert(abc); } //箭头函数 window.onload = ()=>{ alert(&quo ...
- ES6中的箭头函数与普通函数的区别
箭头函数与普通函数的区别 1.语法上更加简洁.清晰 基本语法: // 关于箭头函数的参数 // 如果箭头函数没有参数,直接写一个括号即可 let fun1 = () => { console.l ...
- ES6中的箭头函数和普通函数有什么区别?
1.普通函数中的this总是指向调用它的那个对象, 箭头函数没有自己的this,他的this永远指向其定义环境,任何方法都改变不了其指向,如call().bind().apply().(正是因为它没有 ...
随机推荐
- Web安全(更新中)
sql注入 创建一个数据库 create database admin1; 查询数据库 查看所有数据库 show databases; 使用该数据库 use admin1; 创建一个表 创建一个 ...
- 机器学习--Micro Average,Macro Average, Weighted Average
根据前面几篇文章我们可以知道,当我们为模型泛化性能选择评估指标时,要根据问题本身以及数据集等因素来做选择.本篇博客主要是解释Micro Average,Macro Average,Weighted A ...
- Mariadb3—多表查询
1.内关联 select 字段名 from 表名1 inner join 表名2 on 表名1.字段名=表名2.字段名 where 条件 2.左关联 select 字段名 from 表名1 left ...
- istio之envoy常见术语及状态码
基本术语 Downstream(下游):下游主机连接到 Envoy,发送请求并接收响应,即发送请求的主机. Upstream(上游):上游主机接收来自 Envoy 的连接和请求,并返回响应,即接受请求 ...
- ELK安装和配置及常用插件安装
环境 CentOS 7.3 root 用户 JDK 版本:1.8(最低要求),主推:JDK 1.8.0_121 以上 关闭 firewall systemctl stop firewalld.serv ...
- spring boot 通过feign调用api接口
目的:远程调用服务器api,直接上步骤: 1,添加maven依赖,这是必须的: <dependency> <groupId>org.springframework.cloud& ...
- 2021S软件工程——案例分析作业
2021S软件工程--案例分析作业 18231169 黄思为 项目 内容 这个作业属于哪个课程 2021春季软件工程(罗杰 任建) 这个作业的要求在哪里 案例分析作业 我在这个课程的目标是 了解并熟悉 ...
- 《机器学习Python实现_10_06_集成学习_boosting_gbdt分类实现》
一.利用回归树实现分类 分类也可以用回归树来做,简单说来就是训练与类别数相同的几组回归树,每一组代表一个类别,然后对所有组的输出进行softmax操作将其转换为概率分布,然后再通过交叉熵或者KL一类的 ...
- OAuth 2.0、OIDC 原理
OAuth 目录 OAuth 什么是 OAuth? 为什么是 OAuth? SAML OAuth 和 API OAuth 主要组件 OAuth 作用域 OAuth 参与者 OAuth 令牌 OAuth ...
- Thinkphp5 日期与时间戳相互转换
日期转换为时间戳 $date="2013-10-01 12:23:14"; dump(strtotime($date)); //=>1380601394 时间戳 转换为日期 ...