從 JavaScript 中的函式返回物件
每當我們說要從函式返回一個物件時,我們就是從另一個物件(函式)返回一個物件。有多種方法可以使用函式返回物件。
現在讓我們看看如何從 JavaScript 中的函式返回物件。
從 JavaScript 中的普通函式返回一個物件
JavaScript 中有各種型別的函式。這些函式中的每一個都有不同的定義。
我們將看到這些函式型別中的每一個,我們還將看看我們是否必須在 JavaScript 中使用這些函式中的每一個返回一個物件,並從一個函式中返回任何東西,我們總是使用一個稱為 return
的關鍵字。
常規函式是在 JavaScript 中定義函式的傳統方式。這種型別的函式從其初始版本就存在於 JavaScript 程式語言中。
這個函式有三個東西,一個 function
關鍵字,函式名和函式體。
我們建立了一個名為 returnObj
的函式來返回一個物件。該函式旨在返回一個物件。
我們建立了一個具有兩個欄位的 obj
物件:該函式內的 name
和 company
。
function returnObj(){
var obj = {
"name": "Adam",
"company": "Google",
}
return obj;
}
var myObj = returnObj();
console.log(myObj);
輸出:
{name: 'Adam', company: 'Google'}
我們必須使用 return
關鍵字來返回此物件並返回建立的 obj
。
我們必須建立一個變數 myObj
,然後呼叫 returnObj
函式。在我們呼叫這個函式之後,函式將返回的任何內容(在本例中為一個物件)都將儲存在 myObj
變數中。
最後,如果你列印變數 myObj
,你將獲得整個物件作為輸出。
從 JavaScript 中的匿名函式返回物件
匿名函式是沒有關聯名稱的函式。這種型別的函式只有一個 function
關鍵字和一個函式體。
它是在 ES6 版本的 JavaScript 中引入的。由於這個函式沒有名字,我們不能呼叫這個函式。
所以,要呼叫這個函式,我們先把整個函式存到一個變數中,然後用這個變數名作為函式名來呼叫這個函式,也就是在末尾加上圓括號。
在這裡,我們建立了一個沒有名稱的函式。我們已經建立了與之前建立的相同的物件 obj
。
const myObj = function (){
var obj = {
"name": "Adam",
"company": "Google",
}
return obj;
}
console.log(myObj());
輸出:
{name: 'Adam', company: 'Google'}
最後,我們將返回這個 obj
,然後在我們呼叫這個函式之後,我們從函式返回的物件將儲存在該變數中。
從 JavaScript 中的箭頭函式返回一個物件
箭頭函式也稱為匿名函式。箭頭函式和匿名函式之間的唯一區別是箭頭函式在宣告函式時不使用 function
關鍵字。
相反,它使用箭頭(等號和大於號的組合)=>
來宣告一個函式。在 ES6 版本的 JavaScript 中也引入了這種型別的函式。
在這裡,我們建立了一個空物件 obj
。我們將建立一個以物件為引數的箭頭函式(entireObj
)。
在箭頭函式的主體內,我們將為 entireObj
物件的 name
和 company
屬性設定一些值。然後我們將使用 return
關鍵字返回 entireObj
。
var obj = {};
const myObj = (entireObj)=>{
entireObj.name = "Adam";
entireObj.company = "Google";
return entireObj;
}
console.log(myObj(obj));
輸出:
{name: 'Adam', company: 'Google'}
最後,我們將呼叫函式 myObj
。在呼叫 myObj
函式時,不要忘記將我們在開始時建立的空物件作為引數傳遞。
此操作的結果,即物件,將儲存在 myObj
變數中,然後列印在控制檯上。
Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.
LinkedIn