ホームページ > 記事 > ウェブフロントエンド > JavaScript: 指定されたキーに対応するキーと値のペアをオブジェクトから削除するにはどうすればよいですか?
JavaScript: 指定されたキーに対応するキーと値のペアをオブジェクトから削除するにはどうすればよいですか?
- PHPz転載
- 2023-08-22 15:53:123172ブラウズ
JavaScript では、キーと値のペアの形式でデータを保存するオブジェクトを作成できます。オブジェクト内のデータには、ドット表記 (obj.key) または括弧表記 (obj["key"]) を使用してアクセスできます。以下の例を参照してください。 -
let obj = { key1: "value1", key2: "value2", key3: "value" }; 指定されたキーに対応するキーと値のペアをオブジェクトから削除できますが、削除する前に、これらのキーがオブジェクトに存在することを確認する必要があります。
このチュートリアルでは、3 つの方法を紹介します。 削除演算子の使用
削除演算子は、オブジェクトのプロパティを削除するために使用されます。 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>上の例からわかるように、削除演算子は値の
のみを削除します。 キーそのものではなく、キーです。以下は、上記のコードの 1 行ずつの説明です。-
キーそのものではなくキーです。以下は、上記のコードの 1 行ごとの説明です。-
let obj = { key1: "value1", key2: "value2", key3: "value3" };3 つのキーと値のペアを含むオブジェクトを作成しました。
delete obj.key2;
delete 演算子は、キーが「key2」であるキーと値のペアを削除するために使用されます。
console.log(obj);
コンソール上の上記のコードの出力は次のようになります: { key1: "value1", key3: "value3" } キー「key2」のキーと値のペアがオブジェクトから削除されていることがわかります。
filter() メソッドの使用
filter() メソッドは、既存の配列から新しい配列を作成するために使用されます。以下の例を参照してください。
Example
Examples <script> let obj = { key1: "value1", key2: "value2", key3: "value3" }; 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() メソッドは、 キー自体ではなく、キーです。
以下は、上記のコードの 1 行ずつの説明です:
鍵は鍵そのものです。以下は、上記のコードを 1 行ごとに説明したものです。
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: "value1", key2: "value2", key3: "value3" }; for (let key in obj) { if (key == "key2") { delete obj[key]; } } document.getElementById("result").innerHTML = JSON.stringify(obj); console.log(obj) </script>
上の例からわかるように、for…in ループは、キーの値 キー自体ではありません。
上記のコードを 1 行ずつ説明します:
鍵そのものではありません。以下は、上記のコードを 1 行ごとに説明したものです。
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 中国語 Web サイトの他の関連記事を参照してください。