关于ES6 用箭头函数后的 this 指向问题
最近写完小程序后, 开始学习React, 因为有编译器, 就直接用ES6 新语法了,
中间自然离不开 () => { console.log(‘箭头函数的this是指向哪的问题’)};
var obj2 = {
id: 2333,
test: () => console.log(this)
}
obj2.test();//window
obj2.test.call(obj2);//window
那么我要这里 test函数的this 指向 obj2 是要怎么做呢
来分析下上面代码, 转换成 ES5 写法的this指向:
var obj2 = {}; // window.obj2 = {};
obj2.id = 2333; // window.obj2 = { id: 2333; }
var _this = this;
obj2.test = function(){console.log(_this);}
用箭头函数时, this是指向 最初定义变量时的this, 即 window.obj2 的 window
改一下, 变得很复杂了
var obj2 = {
id: 2333,
test: function(){
(()=>{
console.log(this)
})()
}
}
obj2.test();//obj2
obj2.test.call(obj2);//obj2
其实还有一种写法:
function Obj(){
this.id = 2333;
this.test = () => console.log(this);
}
var obj2 = new Obj();
**************************************************
总结:
1. 箭头函数的this不能用call()或者apply()进行绑定
2. 箭头函数的 this 永远指向该函数构造时的环境。
... 现在还没再nodeJs环境中 用箭头函数, 只知道 浏览器的顶级对象是 window, node环境是 global , 后面深入学习node之后再总结..
关于ES6 用箭头函数后的 this 指向问题的更多相关文章
- 进阶路上有你我-相互相持篇之ES6里箭头函数里的this指向问题
首先复习下普通函数里的this指向: function test(){ console.log(this) } test() 你会秒杀的毫无疑问的回答:window,针对普通函数:谁调用了函数 函数 ...
- ES6扩展——箭头函数
1.箭头函数 在es6中,单一参数的单行箭头函数语法结构可以总结如下: const 函数名 = 传入的参数 => 函数返回的内容,因此针对于 const pop = arr => arr. ...
- ES6学习--箭头函数
1. 箭头函数基本形式 let func = (num) => num; let func = () => num; let sum = (num1,num2) => num1 + ...
- ES6中箭头函数的作用
我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => “abc”; let test2=() => { return “a ...
- 初步探究ES6之箭头函数
今天要介绍的是ES6中的箭头函数. 语法 我们先来看看箭头函数的语法: ([param] [, param]) => { statements } param => expression ...
- ES6 箭头函数下的this指向和普通函数的this对比
首先在网上摘抄借鉴了一段代码, 然后再这段代码里面进行分析,通过比较ES6的箭头函数和普通函数的this指指向, 分析其中的不同之处.下面就是代码片段var name = "window&q ...
- Es6中箭头函数与普通函数的区别
Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...
- es6的箭头函数和es5的function函数区别
一.es6的箭头函数es6箭头函数内部没有this,使用时会上朔寻找最近的this不可以做构造函数,不能使用new命令,因为没有this函数体内没有arguments,可以使用rest参数代替不能用y ...
- es6的箭头函数
1.使用语法 : 参数 => 函数语句; 分为以下几种形式 : (1) ()=>语句 ( )=> statement 这是一种简写方法省略了花括号和return 相当于 ()=&g ...
随机推荐
- ASP.NET没有魔法——ASP.NET MVC路由
之前的文章中介绍了My Blog文章维护功能的开发,开发过程中使用Area的方法建立了用于维护文章的Controller.View和Model.但是无论代码怎么变对于浏览器来说都是通过一个url地址去 ...
- Vs自定义设置
1.固定选项卡独立行显示设置 效果如下 2.语言设置 可以从官网寻找所需版本语言包 https://my.visualstudio.com/downloads 3.代码段设置 可以对现有的进行一些改造 ...
- 织梦DedeCMS v5.7 实现导航条下拉菜单
首先将下面这段代码贴到templets\default\footer.htm文件里(只要在此文件里就行,位置无所谓) <</span>script type='text/javasc ...
- IIS 发布 dedecms 网站教程
这里只是说明了配置 php 前后 iis 默认网站属性的变化,其实在配置完 php 后系统的环境变 量等也是发生了相应的变化了的, 这里就不一一列举了, 这些只有在你手动完成 php 的配置 之后才能 ...
- 无格式转换php
// 无格式转换function ClearHtml($content,$allowtags='') { mb_regex_encoding('UTF-8'); //replace MS specia ...
- jquery 循环获取checkBox的值,以及对复选框选中,取消,操作按钮
法一:jquery 循环获取选中checkBox框的值 function checkeds() { $("input:checkbox").each(function(index) ...
- @ property 与@ synthesize 的作用 VS @interface
表示声明了一个实例属性和它的getter和setter器 只在@interface中定义变量的话,你所定义的变量只能在当前的类中访问,在其他类中是访问不了的:而用@property声明的变量可以在外部 ...
- CCF系列之Z字形扫描(201412-2)
试题编号:201412-2试题名称:Z字形扫描时间限制: 2.0s内存限制: 256.0MB 问题描述 在图像编码的算法中,需要将一个给定的方形矩阵进行Z字形扫描(Zigzag Scan).给定一个n ...
- MySQL 取得小时分钟部分
MySQL 取得小时分钟部分 SELECT `CpParkID` , DATE_FORMAT( `UPDATE_TIME` , '%H:%i' )FROM `cp_park`WHERE HOUR( ` ...
- 策略模式--List排序
需求:根据姓名进行排序,升序或者降序,如果名字一样,就按照id升序排序,用策略模式 步骤一: 定义一个Person对象 public class Person { private Integer id ...