簡體   English   中英

ES6 JavaScript中的括號

[英]Brackets in ES6 JavaScript

我迫切希望有人能給我一些簡明扼要的信息,告訴我什么時候應該在JS ES6中使用哪個括號。 我知道基礎知識,但是當我們開始討論箭頭語法時,我只是失去了它,然后無法理解為什么我們將括號括在括號中......我覺得為了真正理解為什么我們要把事情放在我們的方式上我是否需要首先了解{}和()的所有用例。

例如。 我真的很難找到像這樣的語法:

const func = (obj) => {
console.log(obj.a)
}

func({a: "blue"}) 

這是我在這里掙扎的功能({a:“blue”})。

這是另一個例子:

makeSound({
    a: "bark",
    b: 2,
    c: "hiss"
})

function makeSound(options)
console.log("the" + options.a + "was a " + options.c)

我不知道該怎么做。 我們在makeSound頂部做了什么? 我可以看到我們正在創建一個對象但是為什么我們不只是將它聲明為標准let makeSound = {}的變量。 我們在這做什么? makeSound是什么,直到我們把它變成代碼中的一個函數?

這是我在這里掙扎的功能({a:“blue”})。

{a: "blue"}是一個對象文字。 生成的對象作為參數傳遞給func(...)

我可以看到我們正在創建一個對象但是為什么我們不只是將它聲明為標准let makeSound = {}的變量。

因為它只需要一次

let details = {
    a: "bark",
    b: 2,
    c: "hiss"
};

makeSound(details);

...會給出相同的結果,但現在你已經得到了一個你不再需要的details變量了。

makeSound是什么,直到我們把它變成代碼中的一個函數?

函數聲明被提升,因此它是一個函數,即使聲明稍后出現。

我理解你的困惑,因為確實有很多花括號!

首先, 對象 使用這樣的括號定義對象。

const obj = { a: 1 };

但是你也可以使用像這樣的對象文字直接在函數參數列表中定義一個內聯對象:

myFunc({ a: 1 }); // same as myFunc(obj);

然后你有箭頭功能

它們的主體也使用花括號定義,就像常規函數一樣,如果你想從函數中返回一個值,你必須使用return關鍵字:

const myFunc = (arg) => { return 'hello ' + arg; }

但是,箭頭函數也支持隱式返回,如果省略大括號,則返回值將是隱式的:

const myFunc = (arg) => 'hello ' + arg;

現在,您還可以使用花括號進行解構分配 例如:

const { a } = { a: 1 };

這里的解構發生在=的左邊,它允許你從對象中提取屬性並將它們分配給變量。

您還可以在函數參數中使用對象解構來訪問特定屬性,如下所示:

const myFunc = ({ name }) => 'Hello ' + name;

這相當於:

const myFunc = (person) => 'Hello ' + person.name;

你可以用這樣的對象文字來調用這個函數:

myFunc({ name: 'Jo' });
const func = (obj) => {
    console.log(obj.a)
}

(obj)基本上是說func函數將obj作為參數。

如果你只傳遞一個參數,你也可以這樣寫;

const func = obj => {
    console.log(obj.a)
}

括號的作用基本上使您能夠添加多個參數。 如下所示;

const func = (obj1, obj2) => {
console.log(obj1.a, obj2.a)
}

func({a: "blue"}) 

下一個功能({a:“blue”})

基本上你在這里調用func函數,將對象作為參數作為簡寫。

所以你也可以這樣稱呼它

const argument = {a: "blue"}

func(argument)

你也可能會看到很多這樣的代碼

const func = (obj1, obj2) => console.log(obj1.a, obj2.a)

看看console.log()周圍沒有花括號。 如果函數中只有一行,則可以省略花括號。 當你有多行時,你需要使用花括號來包裝函數體

func = (obj) => {
   if (obj.a === "blue") {
      return true
   } 
   return false
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM