1.为什么要用箭头函数

  • 简洁 易用
  • 固定this 指向(箭头函数在this定义时候生效)

2.箭头函数分析this指向

1.this指向调用函数的对象

  • 情况1

    var obj={
    a:"1",
    b:function(){//this指向这个function局部作用域 这个作用域的调用对象是obj 所以this指向obj
    return ()=>{
         console.log(this); //obj
         console.log(this.a) //'1'
    }
    }
    }
    obj.b()();

      

  • 情况2
function a(){
return ()=>{ //因为箭头函数和a函数有相同的对象 被window调用则指向window对象
console.log(this)//window
}
}
a()();

2.this指向window

var a=2;//这里不能换成let a=2 因为window.获取不到a的值
var obj={
a:"1",
b:()=>{//由于对象不是作用域 所以作用域指向 全局window
console.log(this)//window
console.log(this.a)//2
}
}
obj.b();

总结:1. 箭头函数在定义的时候生效 而普通函数则在调用的时候生效

2.箭头函数没有自己的this,所以它总是指向外层代码块的this   (全局作用域,局部作用域)

3.当箭头函数所在的代码块为函数时候 则谁调用这个函数this就指向谁

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

  1. ES6 箭头函数 this 指向

    ES6 箭头函数 this 指向 箭头函数有几个使用注意点: 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个 ...

  2. ES6 箭头函数this指向问题

    var name = "window"; var person1 = { name: "person1", show1: function() { consol ...

  3. 箭头函数this指向问题

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

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

    es5中 this 的指向 var factory = function(){ this.a = 'a'; this.b = 'b'; this.c = { a:'a+', b:function(){ ...

  5. 5. 箭头函数_this 指向_es6 常用语法

    1. 箭头函数 函数的简写方式 () => {} 只有一个参数时,可以省略() ---- x => {} 只有一条语句时,可以省略{},此时这点语句的结果会作为函数的返回值返回  () = ...

  6. typescript 属性默认值使用箭头函数 this指向问题

    今天注意到前端小伙伴用react 定义component class的方法的时候是通过箭头函数的方式,表示好奇. class Test extends React.Component { public ...

  7. ES6箭头函数this指向

    普通函数中的this: 1. this总是代表它的直接调用者(js的this是执行上下文), 例如 obj.func ,那么func中的this就是obj 2.在默认情况(非严格模式下,未使用 'us ...

  8. 箭头函数中可改变this作用域,回调函数用箭头函数this指向page,自定义事件用箭头函数this指向undefined

    1.回调函数中,用箭头函数改变this的作用域 success: (res)=>{ this.setData({ //此时,this指向page页面 ... }) } 2.自定义事件中,如果使用 ...

  9. js中箭头函数 及 针对箭头函数this指向问题引出的单体模式

    ES6允许使用“箭头”(=>)定义函数 var f = a = > a //等同于 var f = function(a){ return a; } 如果箭头函数不需要参数或需要多个参数, ...

  10. ES6 箭头函数this指向

    箭头函数有几个使用注意点. (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. (2)不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误. (3)不可以使 ...

随机推荐

  1. [USACO09JAN]Total Flow【网络流】

    Farmer John always wants his cows to have enough water and thus has made a map of the N (1 <= N & ...

  2. sql 分组后查询出排序字段

    select  row_number() over(partition by  CODE order by SEQUENCE) as RowIndex  from Table 注:根据表的CODE 字 ...

  3. nginx 部署php项目 404

    服务器重启了一下 然后访问程序报错404的情况 文件存在位置没有问题 niginx配置根目录没有问题 最后检查到端口的时候发现php-fpm的9000端口未打开 service php-fpm res ...

  4. 5G将至,4G降速:是谣言还是真相?

    畅用移动智能终端设备,早已成为大众日常生活中的一部分.卫报专栏作家伯克曼提到,"据估计,70%的人会抱着手机或iPad刷资讯入睡."当移动智能终端变得如此重要时,与之息息相关的网络 ...

  5. SSM项目集成Lucene+IKAnalyzer在Junit单元测试中执行异常

    个人博客 地址:http://www.wenhaofan.com/article/20181108132519 问题描述 在项目运行以及main方法中能够正常运行,但是使用junit单元测试时却报如下 ...

  6. django css文件导入,模板继承

    今天写了一下模板继承 刚开始感觉还行,也挺简单的 当只有html的时候还是能继承到的,代码如下.首先在父html文件里加入 {% block content %} {% block extracss ...

  7. Selenium模块/目录说明

      目录说明: selenium/common     #定义了webdriver的异常类 selenium/webdriver   #定义了webdriver所有python实现: 1.各种浏览器支 ...

  8. php对数组排序 关联数组功能比较

    用php在国家统计局中抓取 省市区县 代码.名称.排序order id,处理方式是通过curl请求网址,正则匹配 获取信息,并保存为json文件,以便后期读取文件. 过程中或遇到对json文件转化为数 ...

  9. C语言结构体数组遇上typedef

    昨天韩同学在做数据结构题的时候,问了我一个关于typedef 与结构体数组的问题: typedef struct vexnode { int vertex; arcnode* firstarc; }a ...

  10. codeblocks汉化

    1.- 汉化包 腾讯微云 2.首先打开codeblocks安装文件夹,如:D:\CodeBlocks\share\CodeBlocks\locale\zh_CN,注意:zh_CN文件夹需自行创建 3. ...