石川es6課程 4 箭頭函式

2022-03-23 18:22:43 字數 4459 閱讀 2927

相當於函式的簡寫,類似python lambda 函式,先了解即可

let show1 = function

() let show2 = () =>

show1()

//呼叫函式

show2()

() => {} :// 箭頭函式,去掉 function, 加上 =>如果只有乙個引數,()可以省;如果只有乙個return,{}可以省

let show4 = function

(a)

let show5 = a => a * 2 //

簡潔,類似python lambda 函式

//

普通函式

function

name()

//箭頭函式,去掉 function, 加上 =>

() =>

let show1 = function

() let show2 = () =>

show1()

//呼叫函式

show2()

let show4 = function

(a)

let show5 = a => a * 2 //

簡潔,類似python lambda 函式

console.log(show4(10))

console.log(show5(10))

function()
() =>
如果只有乙個引數,()可以省略

如果只有乙個return語句,{}可以省略

let show=()=>

// show();

let show1= a =>

show1(777)

let arr=[12,5,8,99,14,26]

arr.sort((a,b) => )

## 4.函式-箭頭函式

- 箭頭函式,就是函式的簡寫

- 如果只有乙個引數,`()` 可以省

- 如果只有乙個`return`,`{}`可以省

```js

// 普通函式

function name()

// 箭頭函式,去掉 function, 加上 =>

() =>

``````js

let show1 = function ()

let show2 = () =>

show1() // 呼叫函式

show2()

let show4 = function (a)

let show5 = a => a * 2 //簡潔,類似python lambda 函式

console.log(show4(10))

console.log(show5(10))

```

**或參考:es6箭頭函式總結

1. 箭頭函式基本形式

let func = (num) =>num;

let func = () =>num;

let sum = (num1,num2) => num1 +num2;

[1,2,3].map(x => x * x);

2. 箭頭函式基本特點

(1). 箭頭函式this為父作用域的this,不是呼叫時的this

let person =

}}person.init();

上例中,init是function,以person.init呼叫,其內部this就是person本身,而onclick**是箭頭函式,

其內部的this,就是父作用域的this,就是person,能得到name。

let person =

}}person.init();

上例中,init為箭頭函式,其內部的this為全域性window,onclick的this也就是init函式的this,也是window,

得到的this.name就為undefined。

(2). 箭頭函式不能作為建構函式,不能使用new

//

建構函式如下:

function

person(p)

//如果用箭頭函式作為建構函式,則如下

var person = (p) =>

由於this必須是物件例項,而箭頭函式是沒有例項的,此處的this指向別處,不能產生person例項,自相矛盾。

(3). 箭頭函式沒有arguments,caller,callee

箭頭函式本身沒有arguments,如果箭頭函式在乙個function內部,它會將外部函式的arguments拿過來使用。

箭頭函式中要想接收不定引數,應該使用rest引數...解決。

let b = (b)=>

b(2,92,32,32); //

uncaught referenceerror: arguments is not defined

let c = (...c) =>

c(3,82,32,11323); //

[3, 82, 32, 11323]

let obj2 =,

c: function

(n) ;

return

f.call(m,n);

}};console.log(obj2.b(1)); //

11console.log(obj2.c(1)); //

11

(5). 箭頭函式沒有原型屬性

var a = ()=>

function

b()console.log(a.prototype);

//undefined

console.log(b.prototype); //

(6). 箭頭函式不能作為generator函式,不能使用yield關鍵字

(7). 箭頭函式返回物件時,要加乙個小括號

var func = () => (); //

正確var func = () => ; //

錯誤

(8). 箭頭函式在es6 class中宣告的方法為例項方法,不是原型方法

//

deom1

class super}//

通過super.prototype可以訪問到sayname方法,這種形式定義的方法,都是定義在prototype上

var a = new

super()

var b = new

super()

a.sayname === b.sayname //

true

//所有例項化之後的物件共享prototypy上的sayname方法

//demo2

class super}//

通過super.prototype訪問不到sayname方法,該方法沒有定義在prototype上

var a = new

super()

var b = new

super()

a.sayname === b.sayname //

false

//例項化之後的物件各自擁有自己的sayname方法,比demo1需要更多的記憶體空間

因此,在class中盡量少用箭頭函式宣告方法。

(9). 多重箭頭函式就是乙個高階函式,相當於內嵌函式

const add = x => y => y +x;

//相當於

function

add(x);

}

(10). 箭頭函式常見錯誤

let a =

a.bar()

//undefined

bar函式中的this指向父作用域,而a物件沒有作用域,因此this不是a,列印結果為undefined

function

a()

a.prototype.bar = () => console.log(this

.foo)

let a = new

a()a.bar()

//undefined

原型上使用箭頭函式,this指向是其父作用域,並不是物件a,因此得不到預期結果

參考:

石川es6課程 5 函式 引數

收集引數 收集剩餘的引數,必須當到最後乙個引數位置 function show a,b,args console.log show 1,2,3,4,5 展開引數 展開陣列,簡寫,效果和直接把陣列的內容寫在這兒一樣 let arr3 arr1,arr2 展開陣列,簡寫,效果和直接把陣列的內容寫在這兒一...

石川es6課程 7 陣列

主要就map 對映 乙個對乙個 reduce 彙總 一堆出來乙個 filter 過濾器,foreach 迴圈 迭代 四個方法 使用形式就是方法裡面接匿名函式作為引數 例如let result arr.map function item es6簡化版 let res arr.map item item...

石川es6課程 6 解構賦值

結構相同一一對應的方式賦值 let json,arr,num,str 1,2,3 8,str let json,arr,num,str 1,2,3 8,str console.log json,arr,num,str 1.左右兩邊結構必須一樣 let a,b 報錯。左右兩邊結構必須一樣 2.右邊必須...