1


2


3


4


5


6


7


8


9


10


11


12


13


14


15


16


17


18


19


20


21


22


23


24


25


26


27


28


29


30


31


32


33


34


35


<!DOCTYPE html>  


<html>  


    <head>  


        <meta charset="UTF-8">  


        <title></title>  


    </head>  


    <body>  


        <script>  


      


    var test1=()=>{  


        console.log(this.name,this);  


    }  


    window.name = "obj window";  


    class {  


        constructor(){  


            this.name = "class p";  


        }  


        func(){  


            var test2 = () =>{  


                console.log(this.name,this);  


            };  


            function test3(大专栏  es6this箭头函数 class="params">){  


                console.log(this);  


            }  


            test1();


            test2();//class p  


            test3();//undefined  


        }  


    }  


    var p = new P();  


    p.func();  


      


        </script>  


    </body>  


</html>

js中函数作用域属于静态作用域，就是函数作用域的嵌套关系在函数定义时确定了，废话不多说直接上例子

1


2


3


4


5


6


7


8


9


10


[javascript] view plain copy


var a='out a';  


function test(){  


    console.log(a); // out a  


}  


function outer(){  


    var a="in a";  


    test()  


};  


outer();

ok，接下来就是箭头函数的this，

以下为我的理解，如有不正之处，望指点。

箭头函数不能用于构造函数，在上面的例子中，test1箭头函数定义在最外面，当test1函数打印this对象时会根据定义时决定的作用域嵌套关系逐级向上查找，因此查找的是window对象，在test2箭头函数中，由于test2定义在类P的func函数中，test2箭头函数打印this时，会先去func方法查找，找到了，然后打印。test3中，类中的方法默认开启了严格模式 所以test3中this为undefined。 可以将箭头函数中的this类比为函数中定义的变量，使用时按照定义时决定的作用域逐级查找直到找到为止。

原文地址

es6this箭头函数的更多相关文章

  1. 区别ES3ES5和ES6this的指向问题。区分普通函数和箭头函数中this的指向问题

    ES3 ES5this的指向问题 this指的是该函数被调用的对象 var foo = function () { this.a = 'a', this.b = 'b', this.c = { a: ...

  2. ES6 箭头函数中的 this？你可能想多了（翻译）

    箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...

  3. ES6箭头函数与展开运算符

    箭头函数:省去了关键字function和return: eg: reduce=(a,b)=>a+b;//返回a+b的值 redduce=(a,b)=>{console.log(a);con ...

  4. 箭头函数和Buffer对象

    一.箭头函数 普通函数1 var add = function (a, b) { return a + b; } 普通函数2 function add (a, b) { return a + b; } ...

  5. 深入理解this机制系列第三篇——箭头函数

    × 目录 [1]痛点 [2]解决 [3]基本用法[4]回调函数[5]注意事项 前面的话 this机制与函数调用有关,而作用域则与函数定义有关.有没有什么是可以将this机制和作用域联系起来的呢?本文将 ...

  6. Es6 箭头函数

    1.单参数function cheng(a=3){    return a*a;}let cheng= (a=3)=>a*a;console.log(cheng(9));2.多参数functio ...

  7. 【javascript】箭头函数

    ES6标准新增了一种新的函数:Arraw Function(箭头函数). x => x * x 这个函数相当于 function (x){ return x * x; } 题外话:user st ...

  8. JS中generater和箭头函数

    generater跟函数很像: function* fn(x){ yield x; yield x++; return x;} 如上所示,generater用function*定义,可以用yield返 ...

  9. 箭头函数 Arrow Functions/////////////////////zzz

    箭头符号在JavaScript诞生时就已经存在,当初第一个JavaScript教程曾建议在HTML注释内包裹行内脚本,这样可以避免不支持JS的浏览器误将JS代码显示为文本.你会写这样的代码: < ...

随机推荐

  1. [Algo] 292. String Abbreviation Matching

    Word “book” can be abbreviated to 4, b3, b2k, etc. Given a string and an abbreviation, return if the ...

  2. 异常处理和UDP协议

    一.什么是异常? 程序在运行过程中出现了不可预知的错误,并且该错误没对应的处理机制,那么就会以异常的形式表示出来, 造成的影响就是整个程序无法再正常的运行,抛出异常. 二.异常的结构: 1:异常的类型 ...

  3. 新年在家学java之基础篇-参数&修饰符&构造器

    可变参数 不知道可能给方法传递多少个参数时使用这个方法 public void printInfo (String[] args) --可以定义一个数组,在调用这个方法适合赋值给一个数组 public ...

  4. 二十、linux文件系统讲解

    1.分区和文件系统的关系: 为什么需要格式化呢?这是因为分区文件系统在没有格式化前,操作系统是无法识别系统分区的格式的,就没办法组织文件目录属性和权限等内容,把分区格式化成操作系统支持的某个文件系统后 ...

  5. day02-文件操作

    文件操作. 1,文件路径:d:\python一定要学好.txt 2,编码方式:utf-8 gbk .... 3,操作模式:只读,只写,追加,读写,写读..... 不论哪种方式都只能执行一次.例如r模式 ...

  6. Image.FromStream(ms) 提示参数无效

    说明ms有问题,首先确保有读到数据,这种情况是保存到库的时候出错的. 原来你可能是这样写的: MemoryStream stream = new MemoryStream();PictureBox1. ...

  7. 关于Apache Commons-Lang3的使用

    在日常工作中,我们经常要使用到一些开源工具包,比如String,Date等等.有时候我们并不清楚有这些工具类的存在,造成在开发过程中重新实现导致时间浪费,且开发的代码质量不佳.而apache其实已经提 ...

  8. EXAM-2018-7-24

    EXAM-2018-7-24 未完成 [ ] G 签到水题 A J F A:英文字母有2426个 J:注意long long D:Transit Tree Path 我直接套了单源最短路的一个模板,有 ...

  9. 1）session总结

    (1)session的由来: HTTP协议是一种无状态协议,服务器响应完之后就失去了与浏览器的联系,最早,Netscape将cookie引入浏览器,使得数据可以客户端跨页面交换,那么服务器是如何记住众 ...

  10. docker E: Unable to locate package nginx

    在使用docker容器时,有时候里边没有安装vim,敲vim命令时提示说:vim: command not found,这个时候就需要安装vim,可是当你敲apt-get install vim命令时 ...