首頁 > 文章 > web前端 > JavaScript：如何從物件中刪除與給定鍵對應的鍵值對？

JavaScript：如何從物件中刪除與給定鍵對應的鍵值對？

PHPz轉載: 2023-08-22 15:53:123172瀏覽

在JavaScript中，可以建立物件來儲存數據，以鍵值對的形式。可以使用點表示法（obj.key）或括號表示法（obj["key"]）來存取物件中的資料。請參考下面的範例−

let obj = { key1: "value1", key2: "value2", key3: "value" };

我們可以從物件中刪除與給定鍵對應的鍵值對，但是在刪除之前，我們需要確保物件存在這些鍵在本教程中，我們將介紹3種方法。

使用delete運算子

delete運算子用於刪除物件的屬性。 delete運算子不會刪除變數本身，只會刪除變數的值。

範例

請參考下面的範例 -

<!doctype html>
<html>
<head>
   <title>Examples</title>
</head>
<body>
   <div id="result"></div>
   <script>
      let obj = { key1: "value1", key2: "value2", key3: "value3" };
      delete obj.key2;
      document.getElementById("result").innerHTML = JSON.stringify(obj);
      console.log(obj)
   </script>
</body>
</html>

從上面的範例可以看出，delete操作符只刪除值的

key and not the key itself.

Below is the line by line explanation of the above code −

key和不是key本身。

以下是對上述程式碼逐行解釋 −

let obj = { key1: "value1", key2: "value2", key3: "value3" };

我們已經建立了一個包含3個鍵值對的物件。

delete obj.key2;

delete運算子用於刪除鍵值對，其中鍵為「key2」。

console.log(obj);

上述程式碼在控制台的輸出將是：{ key1: "value1", key3: "value3" } 你可以看到，鍵為「key2」的鍵值對已從物件中刪除。

使用filter()方法

filter()方法用於從現有陣列建立一個新陣列。請參考下面的範例：

範例




   Examples


   
   <script>
      let obj = { key1: &quot;value1&quot;, key2: &quot;value2&quot;, key3: &quot;value3&quot; };
      let newObj = Object.keys(obj)
      .filter(key => key != "key2")
      .reduce((acc, key) => {
         acc[key] = obj[key];
         return acc;
      }, {});
      document.getElementById("result").innerHTML =
      JSON.stringify(newObj);
      console.log(newObj)
   </script>

從上面的範例可以看出，filter()方法只刪除了值的 the key and not the key itself.

Below is the line by line explanation of the above code:

關鍵是關鍵本身。

以下是對上述程式碼逐行解釋：

let obj = { key1: "value1", key2: "value2", key3: "value3" };

我們已經建立了一個包含3個鍵值對的物件。

let newObj = Object.keys(obj)
.filter(key => key != "key2")
.reduce((acc, key) => {
   acc[key] = obj[key];
   return acc;
}, {});

Object.keys()方法用來建立一個包含物件鍵的陣列 filter()方法用於從現有數組建立一個新數組。關鍵是與“key2”相比較。如果不相等，則將鍵值對新增至新數組中 reduce()方法用於將陣列縮減為一個物件。

console.log(newObj);

上述程式碼的輸出將會是：

{ key1: "value1", key3: "value3" }

。正如您所看到的，被刪除的鍵為“key2”的鍵值對已從物件中刪除。

使用for…in迴圈

for…in迴圈用於遍歷物件的屬性。

範例

請參考以下範例−




   Examples


   
   <script>
      let obj = { key1: &quot;value1&quot;, key2: &quot;value2&quot;, key3: &quot;value3&quot; };
      for (let key in obj) {
         if (key == "key2") {
            delete obj[key];
         }
      }
      document.getElementById("result").innerHTML =
      JSON.stringify(obj);
      console.log(obj)
   </script>

從上面的範例可以看出，for…in迴圈只刪除鍵的值 and not the key itself.

Below line by-line explanation of the above code:

並不是密鑰本身。

以下是對上述程式碼逐行解釋：

let obj = {key1: "value1", key2: "value2", key3: "value3"};

我們已經建立了一個包含3個鍵值對的物件。

for (let key in obj) {
   if (key == "key2") {
      delete obj[key];
   }
}

使用for…in迴圈來遍歷物件的屬性。 key變數用於儲存物件的鍵。如果鍵是“key2”，則從物件中刪除鍵值對。

console.log(obj);

上述程式碼的輸出將會是：

{ key1: "value1", key3: "value3" }

。正如您所看到的，被刪除的鍵名為“key2”的鍵值對已從物件中刪除。

結論

在本教程中，我們介紹了3種方法來刪除與鍵值對相對應的鍵值對給定一個物件的鍵。刪除操作符，for...in迴圈和filter()方法。

以上是JavaScript：如何從物件中刪除與給定鍵對應的鍵值對？的詳細內容。更多資訊請關注PHP中文網其他相關文章！

JavaScript Object 运算符 for Filter 循环 delete 对象 for...in

陳述：

本文轉載於：tutorialspoint.com。如有侵權，請聯絡admin@php.cn刪除

上一篇：如何在JavaScript中檢查空/未定義/空字串？下一篇：如何在JavaScript中檢查空/未定義/空字串？

看更多