關於箭頭函式的思考

自從有了es6箭頭函式這個靈活的功能，現在寫函式都習慣寫成箭頭函式格式

() => {}

然而如果不理解箭頭函式的原理，濫用它也會造成很大的影響。

思考下面這個問題

let func = value => console.log(value)
let func = function(value)

我們到平台上測試一下, 顯然兩者不等。

let func = value => console.log(value)
// 等同於
"use strict";
var func = function func(value) ;

而console.log()方法返回undefined

return undefined與沒有返回值一樣。所以效果上問題中兩種寫法沒有差異。

let func = value => value
// 等同於
let func = value => 
// 等同於
var func = function func(value) ;

如果箭頭函式的**塊部分多於一條語句，就要使用大括號將它們括起來，並且使用return語句返回。

var sum = (num1, num2) =>

那如果我使用了箭頭，使用了大括號，沒使用return呢？

var sum = (num1, num2) => 
'use strict';
var sum = function sum(num1, num2) ;

由於大括號被解釋為**塊，所以如果箭頭函式直接返回乙個物件，必須在物件外面加上括號

let getinfo = name => ();

使用箭頭函式必須要有返回值嗎？

// 如果箭頭函式只有一行語句，且不需要返回值
let fn = () => void doesnotreturn(); // void

箭頭函式表示式：沒有自己的 this arguments super new.target, 不能用作建構函式，沒有prototype屬性，不能用作生成器

箭頭函式不會建立自己的 this, 它只會從自己作用域鏈的上一層繼承this這點很重要。如下面示例，箭頭函式內的this的作用域上一層即person函式內的this

function person(), 1000);
}var p = new person();

var adder = ,
addthrucall: function(a) ;
return f.call(b, a);
},addtest: function(a) ;
return f.call(b, 23, a);
}};console.log(adder.add(1));         // 輸出 2
console.log(adder.addthrucall(1)); // 仍然輸出 2
console.log(adder.addthrucall('a')); // 輸出 24 （23+1）

很明顯了，第乙個引數會被忽略是忽略call方法裡的第乙個引數(好像是我在思考的時候想多了，這很明顯呀）

參考資源

關於箭頭函式

一為什麼存在 const person 1000 person.sayhello 因為setinterval執行的時候，是在全域性作用域下的，所有this指向的是全域性window,而window上沒有name和age，所以輸出的是undefined。通常的寫法是快取this,然後在setinte...

關於JavaScript的箭頭函式

箭頭函式是乙個簡寫形式的函式表示式，並且它擁有詞法形式的this值基本用法 var f v v 這個函式等同於 var f function v var sum num1,num2 num1 num2 等同於 var sum function num1,num2 first last 等同於 fu...

關於箭頭函式的理解摘記

參考 1.箭頭函式 arrow function 是規格裡面的用語。事實上，整個規格裡面一次也沒有提到lambda。2.箭頭函式的this，總是指向定義時所在的物件，而不是執行時所在的物件這句話是對的，並沒有寫錯 3.function foo 100 foo call 請問，上面的，到底是箭...

關於箭頭函式的思考

關於箭頭函式

關於JavaScript的箭頭函式

關於箭頭函式的理解摘記

相關推薦