我无法在 js 中访问我的对象的内部数据

Question

In my online shop I want to add client order by item to orders. First I click and add an Item from db. Then I pass chosen item to js.

$('#addItem').click(function () {
   let itemData = $('#item').val();

   console.log(itemData);
});

this is output:

{"id":1,"business_id":401,"name":"\u067e\u06cc\u0631\u0627\u0647\u0646","discount_model":1,"special_date":0,"hot_offer":0,"percent":30,"buy_quantity":null,"prize_quantity":null,"prize_name":null,"floor_buy":null,"discount_percent":null,"is_active":1,"created_at":"2019-07-02 06:43:23","updated_at":"2019-07-02 06:44:51"}

now I want itemData.name or itemData['name'], but it says: undefined !?

How can I access to props?

Answer 1

Simply you can't call properties from string, you have to convert the String to JSON object, The below parse method can do it.

itemData = JSON.parse(itemData)

Refer simple example :

 var myJsonStr = '{"id":1,"business_id":401,"name":"\پ\ی\ر\ا\ه\ن","discount_model":1,"special_date":0,"hot_offer":0,"percent":30,"buy_quantity":null,"prize_quantity":null,"prize_name":null,"floor_buy":null,"discount_percent":null,"is_active":1,"created_at":"2019-07-02 06:43:23","updated_at":"2019-07-02 06:44:51"}'; var myJson = JSON.parse(myJsonStr); console.log(myJson.name);

Answer 2

Please try this

$('#addItem').click(function () {
  let itemData = $('#item').val();
  try {
    itemData = JSON.parse(itemData);
  } catch(e) {
    throw e;
  }

  console.log(itemData.name);
});

Answer 3

tldr; safely access nested objects in JavaScript in a super cool way.

Most of the times when we're working with JavaScript, we'll be dealing with nested objects and often we'll be needing to access the innermost nested values safely.

Let's take this nested object as an example.

const user = { id: 101, email: 'jack@dev.com', personalInfo: { name: 'Jack', address: { line1: 'westwish st', line2: 'washmasher', city: 'wallas', state: 'WX' } } }

To access the name of the our user, we'll write

const name = user.personalInfo.name; const userCity = user.personalInfo.address.city;