映射對象以將對象轉換為數組

Question

我在這里有此功能：

var obj = {
  name: 'Holly',
  age: 35,
  role: 'producer'
};


function convertObjectToList(obj) {
 return Object.keys(obj).map(k => [k, obj[k]]);
}
convertObjectToList(obj);

此函數將數組轉換為obj。 因此，如果我在上面具有該obj，我將得到以下內容：

[['name', 'Holly'], ['age', 35], ['role', 'producer']]

現在我要集中在這里：

return Object.keys(obj).map(k => [k, obj[k]]);

分解起來， Object.keys基本上返回給定對象自己的可枚舉屬性的數組，並將映射迭代到數組中，等等。 我試圖理解上面的箭頭功能，並嘗試將其分解為更簡單易懂的代碼。

function convertObjectToList(obj) {
 Object.keys(obj).map(function(key){
     obj = [key, obj[key]];
 });
  console.log(obj);
}

但是這個沒有用。 相反，它僅返回[“ role”，未定義]。

有沒有人可以讓我用通俗易懂的術語理解並分解代碼，以便我可以清楚地理解。

對不起，我是初學者。 菜鳥。

Answer 1

箭頭函數與函數類似，但是語法不同。 普通函數使用語法

function(x, y){
    return x + y;
}

箭頭函數使用單行語法

(x, y) => x + y

或多行語法

(x, y) => {
    return x + y;
}

---

在您的示例中

return Object.keys(obj).map(k => [k, obj[k]]);

轉換為

return Object.keys(obj).map(function(k) {
    return [k, obj[k]];
});

因為該函數采用一個參數k （在箭頭之前）並返回[k, obj[i]] （在箭頭之后）。

Answer 2

應該是這樣

 var obj = { name: 'Holly', age: 35, role: 'producer' }; function convertObjectToList(obj) { return Object.keys(obj).map(function (k) { return [k, obj[k]]; }) } convertObjectToList(obj); 

Answer 3

這是您的第二個功能：

function convertObjectToList(obj) {
  Object.keys(obj).map(function(key){
   obj = [key, obj[key]];
  });
  console.log(obj);
}

這里有些地方不合時宜：

1. 您的第二個函數沒有返回值。 因此，函數調用convertObjectToList將返回未定義。
2. 您正在使用數組[key, obj[key]]重新分配obj的值，這不是您想要執行的操作。 這就是為什么要獲取['role'，未定義]，因為obj的最后一個鍵是role，並且由於obj已被修改為不是對象的數組，所以obj['role']將返回未定義。
3. 您需要在地圖內部返回一個值，否則返回數組中的每個元素都是不確定的。

因此正確的代碼如下：

 var obj = { name: 'Holly', age: 35, role: 'producer' }; function convertObjectToList(obj) { return Object.keys(obj).map(function(key){ let currElement = [key, obj[key]]; return currElement }); } var res = convertObjectToList(obj); console.log(res); 

Answer 4

使用箭頭功能時，如果箭頭功能僅包含一行，則可以避免使用return語句。 因此，使用常規函數時，您需要手動返回

 var obj = { name: 'Holly', age: 35, role: 'producer' }; function convertObjectToList(obj) { return Object.keys(obj).map(function(k) { return [k, obj[k]] }); } var result = convertObjectToList(obj); console.log(result); 

Answer 5

Object.keys返回一個數組，該數組的元素是與直接在obj中找到的可枚舉屬性相對應的字符串。 屬性的順序與手動循環對象的屬性所給出的順序相同。

    var arr = ["a", "b", "c"];
alert(Object.keys(arr)); // chiama alert con argomento "0,1,2"

// array like object
var obj = { 0 : "a", 1 : "b", 2 : "c"};
alert(Object.keys(obj)); // chiama alert con argomento "0,1,2"

假設您正在傳遞對象，則將像這樣構建地圖，這就是您的結果。

function objToStrMap(obj) {
    const strMap = new Map();
    for (const k of Object.keys(obj)) {
        strMap.set(k, obj[k]);
    }
    return strMap;
}

在您的代碼中嘗試此更改

function convertObjectToList(obj) {
 Object.keys(obj).map(function(key){
     return [key, obj[key]];  //obj = [key, obj[key]];
 });

}

Answer 6

您需要了解map函數是如何工作的，以查看您做錯了什么。 map函數帶有一個回調函數，我們將其稱為The Mapper 。 此函數接受數組中的每個項目，對其進行一些操作，然后返回操作結果。 map函數本身在數組上循環，每次都將一個項目傳遞給映射器，然后將結果添加到NEW數組中。

這是使用舊的for循環的map函數的實現：

function customMap(array, mapper) {
  var result = [];
  for (int i = 0; i < array.length; i++) {
    var temp = mapper(array[i]);
    result.push(temp);
  }
  return result;
}

現在，我們可以將此實現與您的函數進行比較，看看您做錯了什么：

1. 您的映射器函數未返回任何內容。 因此，在上面的實現中， temp的值將是未定義的，並且將被推入結果數組。
2. 您試圖將映射器應用於整個obj對象，而不是應用於keys數組中的每個項目。 這樣，您更改了obj變量的值，因此在第一次迭代后丟失了其內容。
3. 您的convertObjectToList本身沒有返回任何內容，因此末尾沒有任何顯示。

要解決此問題，可以使用以下方法：

 var obj = { name: 'Holly', age: 35, role: 'producer' }; function convertObjectToList(obj) { return Object.keys(obj).map(function(key) { var temp = [key, obj[key]]; console.log('current item: ', temp); return temp; }); } var result = convertObjectToList(obj); console.log('final result: ', result); 

最后，沒有必要為菜鳥道歉-我們都是從這樣開始。