es6的箭头函数中this指向是跟普通function中的this指向不同的,普通function的this指向取决于调用function的对象,

而箭头函数的this指向取决于声明它的对象,看下面这个例子

       var a1 = 1;
            function func1(){
                this.a1 = 2;
                console.log(this.a1);
            }
            var func2 = () =>{
                console.log(this.a1)
            }
            function func3(){
                this.say = () =>{
                    console.log(this.a1)
                }
            }
            new func1();//2
            func2();//1
            new func3().say();//undefined

func1因为是new形式调用的,func1充当了一个构造器的作用,所以this是指向func1所构造的一个实例,因此func1中的this指向func1实例,而非全局作用域

func2是箭头函数,不过要注意func2不能以new的形式调用,而func2是在全局作用域被声明的,所以func2内访问this.a1相当于window.a1即全局变量a1

func3的作用域内声明了名为say的箭头函数,所以以构造器函数形式调用func3时,func3.say方法this指向的是func3的实例,但是func3并没有定义名为a1的成员变量,所以最后打印结果就是undefined了

箭头函数的this指向的更多相关文章

  1. 前端项目中常用es6知识总结 -- 箭头函数及this指向、尾调用优化

    项目开发中一些常用的es6知识,主要是为以后分享小程序开发.node+koa项目开发以及vueSSR(vue服务端渲染)做个前置铺垫. 项目开发常用es6介绍 1.块级作用域 let const 2. ...

  2. 箭头函数的this指向问题-一看就懂

    OK,对于箭头函数的this 用一句话概括:箭头函数中的this指向的是定义时的this,而不是执行时的this. 如果上面这句话听的是懂非懂或者完全不懂的,没关系,下面会有案例讲解. 举个栗子 来看 ...

  3. ES6箭头函数及this指向

    箭头函数(=>):函数简写 无参数:() => {} 单个参数:x => {} 多个参数:(x, y) => {} 解构参数:({x, y}) => {} 嵌套使用:部署 ...

  4. 箭头函数的this指向问题

    this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this.正是因为它没有this,所以也就不能用作构造函数 ...

  5. 箭头函数以及this指向问题

    一.定义函数的方式 //1.function const aaa = function () { } //2.对象字面量中定义函数 const obj = { bbb() { } } //3.ES6中 ...

  6. ES6箭头函数与this指向

    一.ES6箭头函数 ES6之前的语法想要定义一个函数,如图example1,ES6之后定义一个函数如图example2,相比较之下简洁了很多 二.函数的this指向 非箭头函数,谁调用函数this指向 ...

  7. ES6——>let,箭头函数,this指向小记

    let let允许你声明一个作用域被限制在块级中的变量.语句或者表达式. 还是那个经典的问题:创建5个li,点击不同的li能够打印出当前li的序号. 如果在for循环中使用**var**来声明变量i的 ...

  8. 关于箭头函数的this指向问题

    document.onclick = function(){ // 普通函数的this是在运行的时候才临时绑定的,也就是说,函数不运行,你绝对不可能知道this是谁 // 下面这个函数如果是自调用,t ...

  9. 箭头函数this的指向

    箭头函数的this 什么是箭头函数,箭头函数是es6的新特性,其出现就是为了更好的表示(代替)回调函数 // 箭头函数 (arg1, arg2) => {} // 当箭头函数只有一个参数 arg ...

随机推荐

  1. c++小学期大作业攻略(四)任务系统+站内信

    虽然比最早的预定晚了整整一个星期但这核心功能最后一篇终于还是来了. 如果你已经经历了用户系统的洗礼,相信代码实现应该已经没有太大的难度,所以我们重点关注一下设计好的流程. 一.任务系统 首先是新建任务 ...

  2. vue单页面引入CDN链接

    不想在index.html文件中全局引入CDN资源,那么如何在Vue单文件组件中引入?下面来瞅瞅~ 虚拟DOM创建 Vue 通过创建一个虚拟 DOM 来追踪自己要改变的真实 DOM 什么是虚拟DOM? ...

  3. Ubuntu Nginx https 配置

    #配置http跳转到https 80跳转443server { listen ; server_name www.***.com www.***.cn; https://$server_name$re ...

  4. aspx页面,后端通过Attributes.Add给textbox添加事件时,传参失效问题。

    测试一:------------------------------------------------------------------------------------------------ ...

  5. 一种优化操作list、数组的多线程解决方案。

    这几天接触到了一些操作list的功能,由于list太长,加上每条数据的处理时间,导致性能下降,正好利用学来的多线程知识和网上的资料结合实践一番,写出了一个通用类如下. /** * 操作数组的线程 * ...

  6. DISK2VHD 转win2008 无法启动

    windows 2008R2物理机,使用微软的DISK2VHD转换成虚拟盘,挂到虚拟机上,无法启动只有光标闪.找来window2008安装盘 选择“修复windows系统”, 调出cmd命令提示符Bo ...

  7. C++中Matrix(矩阵)的基本运算( +、-、=、<<)

    利用二维指针开辟空间形成二维数组: 原题为设计一个Matrix类,实现基本的矩阵运算: 初次设计为HL[10][10]数组,存放矩阵元素,后改为二维指针: 主要问题存在于二维指针理解的不透彻,无法理解 ...

  8. Mac 下安装 jdk

    1.安装jdk 我们是需要java环境的- 到oracle官网下载se: Java SE Development Kit 8 Downloads https://www.oracle.com/tech ...

  9. Linux命令2

    http://note.youdao.com/noteshare?id=172b36da28e63a528f2cb70fb7d9ea96 http://note.youdao.com/noteshar ...

  10. day 44

    目录 前端 什么是前端 什么是后端 web服务的本质 请求方式 HTTP协议 1.四大特性 2.数据格式 请求格式 响应格式 响应状态码 HTML 文件的后缀名 HTML的注释 HTML的文档结构 标 ...