最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

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

来源:懂视网 责编:小采 时间:2020-11-27 19:26:43
文档

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

js箭头函数和普通函数的区别:本篇文章主要给大家介绍javascript箭头函数和普通函数的区别,希望对需要的朋友有所帮助!箭头函数——ES6中引入的一个新特性——支持用JavaScript编写简洁的函数。虽然普通函数和箭头函数的工作方式相似,但是它们之间有一些有趣的区别,如下所述。语法普通
推荐度:
导读js箭头函数和普通函数的区别:本篇文章主要给大家介绍javascript箭头函数和普通函数的区别,希望对需要的朋友有所帮助!箭头函数——ES6中引入的一个新特性——支持用JavaScript编写简洁的函数。虽然普通函数和箭头函数的工作方式相似,但是它们之间有一些有趣的区别,如下所述。语法普通
本篇文章主要给大家介绍javascript箭头函数和普通函数的区别,希望对需要的朋友有所帮助!

箭头函数——ES6中引入的一个新特性——支持用JavaScript编写简洁的函数。虽然普通函数和箭头函数的工作方式相似,但是它们之间有一些有趣的区别,如下所述。

语法

普通函数的语法:

let x = function function_name(parameters){ 
 // 函数体
};

普通函数的例子:

let square = function(x){ 
 return (x*x); 
}; 
console.log(sqaure(9));

输出:

4110ee3b0d87992e67478d685c122ac.png

箭头函数的语法:

let x = (parameters) => { 
 // 函数体
};

箭头函数的例子:

var square = (x) => { 
 return (x*x); 
}; 
console.log(square(9));

输出:

9ddf304c3c02a099dc9e13fd4b6de11.png

使用this关键字

与普通函数不同,箭头函数没有自己的this。

例如:

let user = { 
 name: "GFG", 
 gfg1:() => { 
 console.log("hello " + this.name); 
 }, 
 gfg2(){ 
 console.log("Welcome to " + this.name); 
 } 
 }; 
user.gfg1(); 
user.gfg2();

输出:

eb5921d567199f28ed1da722540e8cc.png

arguments对象的可用性

arguments对象在箭头函数中不可用,但在普通函数中可用。

普通函数的例子:

let user = { 
 show(){ 
 console.log(arguments); 
 } 
}; 
user.show(1, 2, 3);

输出:

ab6c1bd607f616f297937c97a18633b.png

箭头函数的例子:

let user = { 
 show_ar : () => { 
 console.log(...arguments); 
 } 
}; 
user.show_ar(1, 2, 3);

输出:

740c591e426e8894f09cddbe4143803.png

使用new关键字

使用函数声明或表达式创建的普通函数是“可构造的”和“可调用的”。由于普通函数是可构造的,因此可以使用'new'关键字调用它们。但是,箭头函数只是“可调用”而不是可构造的。因此,在尝试使用new关键字构造不可构造的箭头函数时,我们将得到一个运行时错误。

普通函数的例子:

let x = function(){ 
 console.log(arguments); 
}; 
new x =(1,2,3);

输出:

62ac04d47ec237737d5e0230f41e309.png

箭头函数的例子:

let x = ()=> { 
 console.log(arguments); 
}; 
new x(1,2,3);

输出:

99d45296ca4bcac4b60f271b3361e77.png

文档

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

js箭头函数和普通函数的区别:本篇文章主要给大家介绍javascript箭头函数和普通函数的区别,希望对需要的朋友有所帮助!箭头函数——ES6中引入的一个新特性——支持用JavaScript编写简洁的函数。虽然普通函数和箭头函数的工作方式相似,但是它们之间有一些有趣的区别,如下所述。语法普通
推荐度:
标签: js 的区别 函数
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top