var obj1={ num:4, fn:function(){ num:5; var f=() => { num:6; console.log(this.num); //4 外层非箭头函数包裹,指向fn的作用域,即obj1 var f2=() => { console.log(this.num); //4 外层箭头函数包裹,向上寻找非箭头函数,指向fn的作用域,即obj1 } f2(); } f(); } } obj1.fn(); function foo() { console.log(t…

相对于普通函数的区别 新的书写方式 this 的改变 不能当构造函数 没有 prototype 属性 没有 arguments 对象 新的书写方式 书写方式很简单!直接看下图, 常规方式写一个函数 const fun = function(number){ return number * 2 }   使用箭头函数 const fun = (number) => { return number * 2 }   如果只有一个参数,还可以省略前面的小括号 const fun = number =>…

转载自:https://juejin.im/post/5aa1eb056fb9a028b77a66fd#heading-1 JavaScript在ES6语法中新增了箭头函数,相较于传统函数,箭头函数不仅更加简洁,而且在this方面进行了改进.this作为JavaScript中比较诡异的存在,许多文章对于this的解释也不尽相同,本篇文章试图厘清JS中函数与this的关系. 一.JS中函数的写法 1.常规函数的写法 在ES6语法之前,JS中的函数由function关键字.params参数和被花括号…

箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也就是说它跟父作用域共享this,不会新产生自己作用域下的this, arguments, super 和 new.target 等对象. 使用箭头函数特性 在JavaScript代码中,函数无处不在.假设页面上有一个特定的按钮,它的id是‘clickMe’,点击它后,页面弹出“Hello,Arrow…

简要介绍:箭头函数中的this,指向与一般function定义的函数不同,比较容易绕晕,箭头函数this的定义:箭头函数中的this是在定义函数的时候绑定,而不是在执行函数的时候绑定. 1.何为定义时绑定 我们来看下面这个例子: (1) var x=11; var obj={ x:22, say:function(){ console.log(this.x) } } obj.say(); //console.log输出的是22 一般的定义函数跟我们的理解是一样的,运行的时候决定this的指向,我…

this 普通函数的this 普通函数的this是由动态作用域决定,它总指向于它的直接调用者.具体可以分为以下四项: this总是指向它的直接调用者, 例如 obj.func() ,那么func()里的this指的是obj. 在默认情况(非严格模式,未使用 'use strict'),如果函数没有直接调用者,this为window 在严格模式下,如果函数没有直接调者,this为undefined 使用call,apply,bind绑定的,this指的是绑定的对象 箭头函数的this 箭头函数是没…

 壹 ❀ 引 在本文之前我已经花了两个篇幅专门介绍了JavaScript中的闭包与this,正好今早地铁上看到了两道面试题,试着做了下发现挺有意思,所以想单独写一篇文章来记录解析过程.若你对于闭包与this有所了解,不妨先看自己的理解是否正确,若你对于这部分知识欠缺,还是建议先阅读我前面的两篇文章,链接在下: 一篇文章看懂JS闭包,都要2020年了,你怎么能还不懂闭包? js 五种绑定彻底弄懂this,默认绑定.隐式绑定.显式绑定.new绑定.箭头函数绑定详解 那么本文开始.  贰 ❀ 题一 /…

直接返回表达式 var odds = evens.map(v => v + 1); var nums = evens.map((v, i) => v + i); var odds = evens.map(function (v) { return v + 1; }); var nums = evens.map(function (v, i) { return v + i; }); 包含语句 nums.forEach(v => { if (v % 5 === 0) fives.push(v…

箭头函数知识点很少,但是要理解清楚,不然看代码会很不适应的. 1. 最简单的写法 x => x*x 可以理解为 我的x要被转化为x*x,所以实际相当于下边的这个 function (x){ return x*x } 2. 箭头函数加块语法 x=>{ ){ } } 3. 当然如果是多个语句,就得用块了,不然就散开了,所以用一个花括号包着 function(x){ ) { ; } ; } 4. 没有参数或者多个参数需要用()吧参数括起来 (x, y)=> x + y; 5. 返回的是一个对象…

前言:第一次看到多个连续箭头函数是在一个 react 项目中,然鹅确认了下眼神,并不是对的人,因为看得一脸懵逼.em......于是开始各种搜索,先是知道了多个连续箭头函数就是 es6 的多次柯里化的写法,对于函数柯里化,很久以前就知道这个名次,但是并不理解,也没有去了解.为了弄明白多个连续箭头函数,开始了简化之路. 首先看到了这样的一个例子: let add = a => b => a + b 以上是一个很简单的相加函数,把它转化成 ES5 的写法如下: let add = function…