function 与 =＞的区别主要是他们的作用域的不同

在JS中，箭头函数并不是简单的function(){}匿名函数的简写语法糖，实际上，箭头函数和匿名函数有个明显的区别：

=>
箭头函数内部的this是词法作用域，在编写函数时就已经确定了。

function
而匿名函数的this指向运行时实际调用该方法的对象，无法在编写函数时确定。

这个示例：

this是词法作用域，在调用方法时，可获取到，正常调用。
如果这；是function，则获取不到方法，未定义

1 function Test() {2     this.num = 100;3 4     this.func = function(){5         console.log(this.num); // 1006         setTimeout(function(){7             console.log(this.num); // undefined8         }, 500);9     };
10 }
11
12 var obj = new Test();
13 obj.func();

这里的方法里调用了setTimeout函数，该函数500毫秒后调用我们定义的函数时，实际上是window对象调用的，所以这时匿名函数的this是指向window而不是指向obj了。

在箭头函数出现之前一般都是这么写的：

 1 function Test() {2     this.num = 100;3 4     this.func = function(){5         console.log(this.num); // 1006         var that = this;7         setTimeout(function(){8             console.log(that.num); // 1009         }, 500);
10     };
11 }
12
13 var obj = new Test();
14 obj.func();

这是利用了闭包的概念。箭头函数可以看做这种方式的语法糖。

如下

 1 function Test() {2     this.num = 100;3 4     this.func = function(){5         console.log(this.num); // 1006         setTimeout(() => {7             console.log(this.num); // 1008         }, 500);9     };
10 }
11
12 var obj = new Test();
13 obj.func();

箭头函数和普通函数的区别

不可以当做构造函数，也就是说，不可以使用 new 命令，否则会抛出错误。
this、arguments、caller等对象在函数体内都不存在。
不可以使用 yield 命令，因此箭头函数不能用作 Generator 函数。

总结

箭头函数除了传入的参数之外，其它的对象都没有！在箭头函数引用了this、arguments或者参数之外的变量，那它们一定不是箭头函数本身包含的，而是从父级作用域继承的。

原文:https://www.cnblogs.com/hammerc/p/7390424.html

function 与 =＞的区别相关推荐

VB中Sub过程与Function过程的区别
VB的通用过程分为两种类型:Sub过程和Function过程.通用过程既可以保存在窗体模块(.Frm)中,也可以保存在标准模块(.Bas)中.通用过程与事件过程不同,它不依附于某一对象,也不是有对象的 ...
Python中类（class）与函数（function）的区别
分享知识传递快乐在 Python 中一直以来都以为函数(function)和方法(method)是一个东西,但后来发现两者是不一样的,那么两者之间有什么区别呢?先看段代码: 代码1: def f ...
jQuery中$(function(){})与(function($){})(jQuery)的区别
首先,这两个函数都是在页面载入后执行的函数,其中两者的区别在于: 在jQuery中$(function(){})等同于jQuery(function(){}),另一个写法为jQuery(documen ...
$(window).load(function(){})和.onload区别
参考文章 https://blog.csdn.net/qq_37763820/article/details/79694963 $(window).load(function(){})和 window ...
function, new function, new Function之间的区别
http://www.jb51.net/article/7955.htm 函数是JavaScript中很重要的一个语言元素,并且提供了一个function关键字和内置对象Function,下面是其可能 ...
jQuery 中 jQuery(function(){})与(function(){})(jQuery) 的区别
转自http://www.cr173.com/html/17629_1.html Jquery是优秀的Javascrīpt框架.我们现在来讨论下在 Jquery 中两个页面载入后执行的函数. 1 $ ...
Javascript 两种 function 定义的区别
大家都知道Javascript 有两个种定义Function的方法非常常用.例如 function a(){alert("a")} var a = function(){alert ...
js中(function(){}()),(function(){})(),$(function(){});之间的区别
1. (function(){}())与(function(){})() 这两种写法,都是一种立即执行函数的写法,即IIFE (Immediately Invoked Function Express ...
$(document).ready(function(){}), $().ready(function(){}) 和 $(function(){}) 三个区别...
三者都是一样的, 最完整的写法是:$(document).ready(function(){}) ready() 函数仅能用于当前文档,因此无需选择器. 所以document选择器可以不要,那么就可以 ...
var foo =function (){}与function foo()的区别
当代码开始运行的时候,第一种方法的初始foo是undefined,当代码运行到var foo =function (){}的时候,foo就变成fuction console.log(foo);//un ...

function 与 =＞的区别

箭头函数和普通函数的区别

总结

function 与 =＞的区别相关推荐

最新文章

热门文章

function 与 =＞ 的区别

箭头函数和普通函数的区别

总结

function 与 =＞ 的区别相关推荐

最新文章

热门文章

function 与 =＞的区别

function 与 =＞的区别相关推荐