JavaScript表示オブジェクト
JavaScriptオブジェクトを表示する方法は？
JavaScriptオブジェクトを表示すると、[objectObject]が出力されます。
例
const person = {
name: "John",
age: 30,
city: "New York"
};
document.getElementById("demo").innerHTML = person;
JavaScriptオブジェクトを表示するための一般的な解決策は次のとおりです。
- オブジェクトのプロパティを名前で表示する
- ループ内のオブジェクトプロパティの表示
- Object.values（）を使用したオブジェクトの表示
- JSON.stringify（）を使用したオブジェクトの表示
オブジェクトプロパティの表示
オブジェクトのプロパティは、文字列として表示できます。
例
const person = {
name: "John",
age: 30,
city: "New York"
};
document.getElementById("demo").innerHTML =
person.name + "," + person.age + "," + person.city;
ループ内のオブジェクトの表示
オブジェクトのプロパティは、ループで収集できます。
例
const person = {
name: "John",
age: 30,
city: "New York"
};
let txt = "";
for (let x in person) {
txt += person[x] + " ";
};
document.getElementById("demo").innerHTML = txt;
ループではperson [x]を使用する必要があります。
person.xは機能しません（xは変数であるため）。
Object.values（）の使用
JavaScriptオブジェクトは、次を使用して配列に変換できますObject.values()。
const person = {
name: "John",
age: 30,
city: "New York"
};
const myArray = Object.values(person);
myArray これでJavaScript配列になり、表示する準備が整いました。
例
const person = {
name: "John",
age: 30,
city: "New York"
};
const myArray = Object.values(person);
document.getElementById("demo").innerHTML = myArray;
Object.values() 2016年以降、すべての主要なブラウザでサポートされています。
| 54 (2016) | 14 (2016) | 47 (2016) | 10 (2016) | 41 (2016) |
JSON.stringify（）の使用
JavaScriptオブジェクトは、JavaScript関数を使用して文字列化（文字列に変換）できます
JSON.stringify()。
const person = {
name: "John",
age: 30,
city: "New York"
};
let myString = JSON.stringify(person);
myString これでJavaScript文字列になり、表示できるようになりました。
例
const person = {
name: "John",
age: 30,
city: "New York"
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
結果は、JSON表記に続く文字列になります。
{"name"： "John"、 "age"：50、 "city"： "New York"}
JSON.stringify() JavaScriptに含まれており、すべての主要なブラウザでサポートされています。
日付を文字列化する
JSON.stringify 日付を文字列に変換します。
例
const person = {
name: "John",
today: new Date()
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
Stringify関数
JSON.stringify 関数を文字列化しません：
例
const person = {
name: "John",
age: function () {return 30;}
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
文字列化する前に関数を文字列に変換すると、これを「修正」できます。
例
const person = {
name: "John",
age: function () {return 30;}
};
person.age = person.age.toString();
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
配列を文字列化する
JavaScript配列を文字列化することも可能です。
例
const arr = ["John", "Peter", "Sally", "Jane"];
let myString = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myString;
結果は、JSON表記に続く文字列になります。
["ジョン"、 "ピーター"、 "サリー"、 "ジェーン"]