目錄

• 一、條件式訪問屬性
• 二、箭頭函式介紹

一、條件式訪問屬性

?. 是ES2020引入的新特性，是一個條件式屬性訪問操作符，當你訪問值為undefined變數的某個屬性值時，如果使用.操作符會直接報錯，如果使用條件式屬性訪問操作符來訪問會返回undefined。

看例子：

let book = {price:10,edition:10,name:"scirpt"
}

console.log(book.page.num)

直接報錯：

TypeError: Cannot read property 'num' of undefined

因為book.page 的值 undefined， undefined

如果你無法確定某個值是uwww.cppcns.comndefined還是物件，除了可以用 if 語句來判斷之外，還可以直接用條件式訪問操作符來訪問某個屬性， 就算被訪問的物件是undefined，也不會報錯。而是返回 undefined

console.log(book.page?.num)

輸出：

undefined

二、箭頭函式介紹

箭頭函式是ES6中出現的一種定義函式的簡寫方法， 用=>分隔引數列表和函式體。

例子：

let square = x=>x**2;

console.log(square(3))

輸出：

9

這個函式的定義等價於傳統函式：

fwww.cppcns.comunction square(x){
    return x**2
}

箭頭函式通常用於把一個udPnMYJOyP未命名函式作為引數傳給另一個函式。

let nums = [1,2,3,4].map(x=>x*2)

console.log(nums)

輸出：

[ 2,4,6,8 ]

箭頭函式讓程式碼看起來更簡潔了。

如果使用傳統的function關鍵字來定義函式，看起來就顯得有點囉嗦

nums = [1,4].map(function(x){return x*2})

console.log(nums)

箭頭函式如果有多個引數，則需要使用括號括起來

const add = (x,y)=>x+y;

console.log(add(1,2))

如果箭頭函式的函式體有多條語句，則要將函式體用大括號括起來，並用return關鍵字返回值

const add = (x,y)=>{let tmp=x+y;return tmp};

console.log(add(1,2))

這時候箭頭函式的函式體和普通的function定義的函式體格式就完全一樣了。所以箭頭函式在簡單的單行語句中才顯得簡潔，並具有可讀性。一旦函式體過於複雜，再用箭頭函式來定義可讀性就沒那麼好了。

到此這篇關於條件式訪問屬性和箭頭函式介紹的文章就介紹到這了,更多相關javascript條件式訪問屬性和箭頭函式內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多www.cppcns.com支援我們！