نمایش اشیاء JavaScript

چگونه JavaScript object را نمایش دهیم؟

نمایش JavaScript object به خروجی [object Object].

مثال

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
document.getElementById("demo").innerHTML = person;

به طور شخصی امتحان کنید

راهکارهای رایج برای نمایش جسم JavaScript عبارتند از:

  • ویژگی‌های جسم را به نام نمایش دهید
  • ویژگی‌های جسم را در حلقه نمایش دهید
  • با استفاده از Object.values() جسم را نمایش دهید
  • با استفاده از JSON.stringify() جسم را نمایش دهید

نمایش ویژگی‌های جسم

ویژگی‌های جسم می‌توانند به عنوان رشته نمایش داده شوند:

مثال

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
document.getElementById("demo").innerHTML =
person.name + "," + person.age + "," + person.city;

به طور شخصی امتحان کنید

نمایش ویژگی‌های جسم در حلقه

می‌توان در حلقه ویژگی‌های جسم را جمع‌آوری کرد:

مثال

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
let txt = "";
for (let x in person) {
txt += person[x] + " ";
};
document.getElementById("demo").innerHTML = txt;

به طور شخصی امتحان کنید

باید در حلقه از person[x] استفاده کنید.

person.x دیگر کار نمی‌کند (چون x یک متغیر است).

با استفاده از Object.values()

با استفاده از Object.values()، هر جسم JavaScript می‌تواند به آرایه تبدیل شود:

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
const myArray = Object.values(person);

myArray حالا یک آرایه JavaScript است و می‌توان آن را نمایش داد:

مثال

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
const myArray = Object.values(person);
document.getElementById("demo").innerHTML = myArray;

به طور شخصی امتحان کنید

از سال 2016، تمام مرورگرهای اصلی پشتیبانی می‌کنند Object.values().

Chrome IE Firefox Safari Opera
54 (2016) 14 (2016) 47 (2016) 10 (2016) 41 (2016)

از JSON.stringify() استفاده کنید

هر جسم JavaScript می‌تواند از تابع JavaScript استفاده کند JSON.stringify() تغییر به رشته (به رشته تبدیل):

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
let myString = JSON.stringify(person);

myString حالا یک رشته JavaScript است و می‌توان آن را نمایش داد:

مثال

const person = {
  name: "Bill",
  age: 19,
  city: "Seattle"
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;

به طور شخصی امتحان کنید

نتایج یک رشته‌ای خواهد بود که از معیارهای JSON پیروی می‌کند:

{"name":"Bill","age":19,"city":"Seattle"}

JSON.stringify() در JavaScript شامل است، تمام مرورگرهای اصلی پشتیبانی می‌کنند.

تغییر تاریخ به رشته

JSON.stringify تغییر تاریخ به رشته:

مثال

const person = {
  name: "Bill",
  today: new Date()
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;

به طور شخصی امتحان کنید

رشته‌سازی تابع

JSON.stringify تاوانی برای رشته‌سازی تابع انجام نمی‌شود:

مثال

const person = {
  name: "Bill",
  age: function () {return 19;}
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;

به طور شخصی امتحان کنید

اگر قبل از رشته‌سازی یک تابع را به رشته تبدیل کنید، این می‌تواند "مستقرر" باشد.

مثال

const person = {
  name: "Bill",
  age: function () {return 19;}
};
person.age = person.age.toString();
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;

به طور شخصی امتحان کنید

رشته‌سازی آرایه

همچنین می‌توانید یک آرایه JavaScript را به رشته تبدیل کنید:

مثال

const arr = ["Bill", "Steve", "Elon", "David"];
let myString = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myString;

به طور شخصی امتحان کنید

نتایج یک رشته‌ای خواهد بود که از معیارهای JSON پیروی می‌کند:

["Bill","Steve","Elon","David"]