JavaScript取json属性值

原创

mob64ca12ea8117 2023-12-18 07:15:33 ©著作权

文章标签 属性值 JSON json 文章分类 JavaScript 前端开发

©著作权归作者所有：来自51CTO博客作者mob64ca12ea8117的原创作品，请联系作者获取转载授权，否则将追究法律责任

JavaScript取json属性值

在使用JavaScript处理数据时，经常会遇到需要获取JSON对象的属性值的情况。JSON（JavaScript Object Notation）是一种用于存储和传输数据的轻量级数据格式，常用于前后端数据交互。本文将介绍如何使用JavaScript取得JSON对象的属性值，并给出相应的代码示例。

JSON对象的属性值获取方法

在JavaScript中，可以使用点号（.）或方括号（[]）来获取JSON对象的属性值。下面分别介绍这两种方法的使用。

使用点号获取属性值

使用点号可以直接通过属性名获取JSON对象的属性值。例如，对于下面的JSON对象：

{
  "name": "John",
  "age": 25,
  "gender": "male"
}

可以通过以下方式获取属性值：

const obj = {
  "name": "John",
  "age": 25,
  "gender": "male"
};

const name = obj.name;
const age = obj.age;
const gender = obj.gender;

console.log(name); // 输出：John
console.log(age); // 输出：25
console.log(gender); // 输出：male

使用方括号获取属性值

使用方括号可以通过属性名的字符串形式获取JSON对象的属性值。这种方式更加灵活，可以根据变量的值来动态获取属性值。例如：

const obj = {
  "name": "John",
  "age": 25,
  "gender": "male"
};

const propertyName = "name";
const propertyValue = obj[propertyName];

console.log(propertyValue); // 输出：John

可以看到，通过将属性名存储在变量propertyName中，并使用方括号来获取属性值，可以实现根据变量值动态获取属性值的效果。

引用形式的描述信息

根据上述介绍，我们可以得出以下结论：

使用点号或方括号可以获取JSON对象的属性值。
使用点号适用于已知属性名的情况，而方括号适用于属性名存储在变量中的情况。

示例代码

为了更好地理解如何取得JSON属性值，下面给出一个完整的代码示例。

const json = `{
  "name": "John",
  "age": 25,
  "gender": "male"
}`;

const obj = JSON.parse(json);

// 使用点号获取属性值
const name = obj.name;
const age = obj.age;
const gender = obj.gender;

console.log(name); // 输出：John
console.log(age); // 输出：25
console.log(gender); // 输出：male

// 使用方括号获取属性值
const propertyName = "name";
const propertyValue = obj[propertyName];

console.log(propertyValue); // 输出：John

在示例代码中，首先将JSON字符串解析为JSON对象。然后，使用点号和方括号分别获取了JSON对象的属性值，最后通过console.log输出了属性值。