ES6中箭头函数的作用
我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数。类似于下面的写法:
let test1=() => “abc”;
let test2=() => { return “abc”};
let sum=(a,b) => a+b;
比如上面的3个ES6的箭头函数的写完,如果用ES5就像下面的写完一样。
其实其等同于下面的ES5的写法:
function test1() {
return "abc"
} function test2(){
return "abc"
} function sum(){
return a+b;
}
那为什么在ES6中引入了箭头函数呢? 最主要的目的就是解决this指针的问题。
我们知道在ES6中,我们可以创建一个class,如果我们默认在其里面加入一个函数的话,其必须在调用的时候,必须绑定this指针,否则不能访问当前类的实例里面的属性。下面举一个具体的例子,为什么其能解决this指针的问题。
比如下面一个一个Person类:
function Person() {
//Person()构造器定义了`this`指针,指向了其实例本身
this.age = 0; setInterval(function growUp() {
//在non-strict模式下,growUp()方法定义了‘this’作为一个全局的对象。其
//不同于Person()构造器生成的‘this’指针
this.age++;
}, 1000);
}
var p = new Person();
在ECMAScript 3/5中, 这个this的指针问题可以通过显示的制定this到一个变量,从而把Person()构造器生成的实例this指针,引入到函数中,具体写完如下:
function Person() {
var that = this;
that.age = 0; setInterval(function growUp() {
// The callback refers to the `that` variable of which
// the value is the expected object.
//这个回调函数引用了`that`变量,其值就代表的是当前对象,而不是一个全局的 //一个this对象
that.age++;
}, 1000);
}
这种写完有点啰嗦和繁杂,那么有没有更为简洁的方式呢?直到ES6出现了箭头函数,才彻底的解决这个问题。下面让我们看看ES6的箭头函数如何写的。
function Person(){
this.age = 0; setInterval(() => {
// |this| 自动的指向当前Person的构造器生成的Person实例
//是不是感觉很简洁
this.age++;
}, 1000);
} var p = new Person();
ES6中箭头函数的作用的更多相关文章
- Es6中箭头函数与普通函数的区别
Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...
- ES6中箭头函数与普通函数this的区别
普通函数中的this: 1. this总是代表它的直接调用者, 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'use strict'),没找到直 ...
- es6中箭头函数 注意点
var aaabbb = 'kkkooo' setTimeout(()=>{ var aaaa = 'kkkk'; console.log(this) },1000); 因为据我了解,箭头函数指 ...
- es6的箭头函数和es5的function函数区别
一.es6的箭头函数es6箭头函数内部没有this,使用时会上朔寻找最近的this不可以做构造函数,不能使用new命令,因为没有this函数体内没有arguments,可以使用rest参数代替不能用y ...
- php中session_start()函数的作用
php中session_start()函数的作用 用$_SESION之前必须要session_start()----其中之一的功能,$_SESSION是服务器端的cookie,相当一个大数组(浏览器关 ...
- layui轮播中箭头不起作用问题
layui轮播中箭头不起作用问题 layui轮播插件在使用中发现箭头不起作用其他都合适,是什么原因造成的呢?发现单独提出layui中的demo是合适的,通过仔细慢慢的寻找,发现layui.use('c ...
- C++中虚函数的作用和虚函数的工作原理
1 C++中虚函数的作用和多态 虚函数: 实现类的多态性 关键字:虚函数:虚函数的作用:多态性:多态公有继承:动态联编 C++中的虚函数的作用主要是实现了多态的机制.基类定义虚函数,子类可以重写该函数 ...
- ES6之箭头函数中的this
在讲箭头函数中的this之前我们先介绍一下普通函数中的this. 普通函数中的this: (1)this指向它的直接调用者 (2)默认的,非严格模式下,没找到直接调用者则指向window ( ...
- ES6笔记② 箭头函数
特性介绍 箭头函数是ES6新增的特性之一,它为JS这门语言提供了一种全新的书写函数的语法. //ES5 function fun(x,y){ return x+y; } console.log(fun ...
随机推荐
- MySQL5.7多源复制
MySQL5.7开始支持多源复制,也就是多主一从的复制架构: 使用多源复制的考虑: 1.灾备作用:将各个库汇总在一起,就算是其他库都挂了(整个机房都无法连接了),还有最后一个救命稻草: 2.备份:直接 ...
- Java final finally finalize有什么不同
① final 可以用来修饰类.方法.变量, ----final修饰的class代表不可以继承扩展 ----final的变量不可以修改 ----final的方法不可以override ----fina ...
- Maven聚合项目在eclipse中显示没有层次
大部分时间都在用idea做maven的项目,今天用eclipse导入了maven项目,果然不出所料,界面有显示问题,各个模块都堆叠在同一层级,根本看不出父项目与子项目之间的层次关系,见下图: 于是找修 ...
- PhpStorm 10.0.3破解版下载
汉化破解版软件下载: http://pan.baidu.com/s/1geNO24r 密码: d5ci 这个汉化破解软件解决了大纲视图里空白的问题. 先安装腾讯电脑管家,然后安装这个软件,安装到最后提 ...
- Dekker算法在多核处理器下的失效
Dekker algorithm是一种著名的并发编程的算法,Dekker算法的核心部分是一组对称的代码来访问一组共享变量,使得两个线程不可能同时进入临界区(只要cpu内存模型是遵循顺序一致性的),从而 ...
- Python3基础 raise + 指定类型异常+异常的解释 产生特定类型异常
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- HDU1510 White rectangles( 乱搞 O(n^3) )题解
思路: 友谊赛的时候一直想到了,但是没想出来怎么遍历才能找到所有矩阵,卡住了. 这里讲一下完整思路:我们用一个num[i][j]表示第i行第j列每一列连续的白色格子数量,然后我们定义一个MIN,并且每 ...
- 【postman】谷歌postman插件的基本选项含义
1.form-data: 就是http请求中的multipart/form-data,它会将表单的数据处理为一条消息,以标签为单元,用分隔符分开.既可以上传键值对,也可以上传文件.当上传的字段是文件 ...
- Codeforces Round #390 (Div. 2) D. Fedor and coupons(区间最大交集+优先队列)
http://codeforces.com/contest/754/problem/D 题意: 给定几组区间,找k组区间,使得它们的公共交集最大. 思路: 在k组区间中,它们的公共交集=k组区间中右端 ...
- DDMS
DDMS 的全称是Dalvik Debug Monitor Service,是 Android 开发环境中的Dalvik虚拟机调试监控服务