JavaScriptでJSONオブジェクト内の配列の値を変更する方法をわかりやすく解説
オブジェクトの中に配列が含まれている場合でも、その配列の値を変更する方法は、通常のオブジェクトのプロパティを変更する場合と基本的に同じです。ここでは一般的な原則がそのまま適用されるため、特別なテクニックは必要ありません。
サンプルコード
次の例では、companies 配列の最初の要素は初期状態では「Tesla」になっています。しかし、値を書き換えた後は最初の要素が「SolarCity」に変更され、その結果が出力として表示されます。
<html>
<body>
<script>
var res1 = "";
var res2 = "";
var obj = {
"name":"Elon musk",
"age":48,
"companies": [
"Tesla", "Spacex", "Neuralink"
]
}
for (var i in obj.companies) {
res1 += obj.companies[i] + "</br>"
}
document.write("Before change: " +" "+res1);
obj.companies[0] = "SolarCity";
for (var i in obj.companies) {
res2 += obj.companies[i] + "</br>"
}
document.write("After change:" +" "+res2);
</script>
</body>
</html>
実行結果
Before change: Tesla Spacex Neuralink After change: SolarCity Spacex Neuralink
ポイント解説
JSONオブジェクト内の配列要素を変更するには、次のような形式でアクセスします。
オブジェクト名.配列名[インデックス番号] = 新しい値;
上記の例では obj.companies[0] = "SolarCity"; と記述することで、インデックス0(先頭の要素)である「Tesla」が新しい値「SolarCity」に置き換えられます。このように、ドット記法でオブジェクト内の配列にアクセスし、インデックスを指定して代入するだけで、簡単に値を更新できます。
また、変更後にもう一度ループ処理を行って配列の内容を出力することで、値が正しく書き換えられたことを確認できます。ネストされた構造を持つJSONデータを扱う際も、この基本操作は同じように応用できるので、覚えておくと非常に便利です。
-
JavaScriptでオブジェクトのプロパティを削除する方法をわかりやすく解説
JavaScriptでオブジェクトのプロパティを削除するには、delete演算子を使用します。delete演算子は、指定したオブジェクトからプロパティそのものを取り除き、削除に成功した場合はtrueを返します。以下に、オブジェクトのプロパティを削除するサンプルコードを示します。サンプルコード<!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0
-
JSONテキストをJavaScriptのJSONオブジェクトに変換する方法を解説
JavaScriptでは、JSON.parse()メソッドを使用することで、JSON形式のテキスト文字列をJavaScriptオブジェクトへと変換できます。このメソッドは、APIから取得したデータやサーバーとの通信で受け取ったJSON文字列を、プログラム内で扱いやすいオブジェクトにパースする際に非常に重要な役割を果たします。 以下は、JSONテキストをJavaScriptオブジェクトに変換する具体的なコード例です。 サンプルコード <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /&