JavaScript中的常规函数​​与箭头函数?

常规函数与箭头函数

一个箭头函数来简洁编写代码。常规 函数和箭头 函数的工作方式相似,但是它们之间存在一些差异。让我们简要地讨论一下这些差异。

箭头函数的语法

let x = (params) => {
//代码
};

正则函数的语法

let x = function functionname(params){
//代码
};

“ this”关键字的用法

它不能在箭头功能中使用“ this”关键字,而在常规功能中可以不受干扰地使用它。

示例

在以下示例中,在对象“ num ”内部使用了常规(矩形)和箭头(正方形)函数,该对象由len(length)和bre(breadth)属性组成。我们的目标是使用箭头函数找到正方形的面积(len * len),并使用常规 函数找到矩形的面积(len * bre)。但是由于“ this ”关键字在 箭头函数中不起作用,因此将正方形 区域的值返回为“ NaN ”,而使用常规 函数,我们得到了矩形 的确切区域如输出所示。

<html>
<body>
<script>
   var num = {
      len: 12,
      bre: 13,
      square:() => {
         document.write(this.len * this.len);
      },
      rectangle(){
         document.write(this.len * this.bre);
      }
   };
   num.square();
   document.write("</br>");
   num.rectangle();
</script>
</body>
</html>

输出结果

NaN
156


“ new”关键字的用法 

箭头的功能是不是“ constructible ”,而是“可赎回”这样的关键词“”,而不能在这里工作常规功能都是“可赎回”和“ constructible ”因此,“”的关键字在这里工作。 

示例

在以下示例中,使用“ new ”关键字将一些参数传递给常规 函数和箭头 函数。但是由于箭头函数不可构造,我们会得到一个错误,而常规函数会得到一个合法的输出。

<html>
<body>
<script>
   var word = function(){
      document.write(JSON.stringify(arguments)); 
       ///  executes '{"0":"Tutorix","1":"Nhooo"}' as output
   };
   new word("Tutorix","Nhooo");  
   var newword = ()=> {
      document.write(JSON.stringify(arguments)); 
      //执行“ newword不是构造函数”作为输出
   };
   new newword("Tutorix","Nhooo");
</script>
</body>
</html>