一、遍历JSON对象
遍历JSON对象可以使用for循环,for-in循环和Object.keys()方法。首先,先定义一个JSON对象:
let person = { "name": "John", "age": 30, "city": "New York" };
使用for循环遍历JSON对象:
for(let key in person) { console.log(key + " : " + person[key]); }
使用for-in循环遍历JSON对象:
for(let key in person) { if(person.hasOwnProperty(key)) { console.log(key + " : " + person[key]); } }
使用Object.keys()方法遍历JSON对象:
Object.keys(person).forEach(function(key) { console.log(key + " : " + person[key]); });
二、遍历JSON对象给input赋值
在Web开发中,常常需要使用JSON对象来获取表单的值或者设置表单的值。以下是设置一个input的value值的方法:
let nameInput = document.getElementById('name'); nameInput.value = person.name;
以下是获取input的value值的方法:
let nameInput = document.getElementById('name'); person.name = nameInput.value;
三、遍历JSON数组
与遍历JSON对象相比,遍历JSON数组有一些不同。以下是JSON数组的一个示例:
let animals = [ {"name":"cat", "age":2}, {"name":"dog", "age":3}, {"name":"rabbit", "age":1} ];
使用forEach遍历JSON数组:
animals.forEach(function(animal) { console.log(animal.name + " : " + animal.age); });
使用for循环遍历JSON数组:
for(let i = 0; i < animals.length; i++) { console.log(animals[i].name + " : " + animals[i].age); }
四、遍历JSONObject
遍历JSONObject的方式与遍历JSON对象类似,可以使用for循环,for-in循环和Object.keys()方法。以下是一个JSONObject的示例:
let fruit = { "apple": {"color":"red", "price":2}, "banana": {"color":"yellow", "price":1.5}, "orange": {"color":"orange", "price":1} };
使用for循环遍历JSONObject:
for(let key in fruit) { console.log(key + " : " + fruit[key].color + ", " + fruit[key].price); }
使用for-in循环遍历JSONObject:
for(let key in fruit) { if(fruit.hasOwnProperty(key)) { console.log(key + " : " + fruit[key].color + ", " + fruit[key].price); } }
使用Object.keys()方法遍历JSONObject:
Object.keys(fruit).forEach(function(key) { console.log(key + " : " + fruit[key].color + ", " + fruit[key].price); });
五、遍历JSON对象的键和值
要遍历JSON对象的键和值,只需要使用for-in循环即可。
for(let key in person) { console.log("键:" + key + ", 值:" + person[key]); }
六、遍历JSON中每一项
使用foreach遍历JSON每一项:
let jsonData = ['{"name":"alice", "age":18}', '{"name":"bob", "age":19}', '{"name":"charles", "age":20}']; jsonData.forEach(function (item, index) { console.log(index + " : " + item); })
七、遍历JSONArray获取数据
遍历JSONArray获取数据可以使用for循环,for-in循环和forEach方法。以下是JSONArray的一个示例:
let persons = [ {"name": "Alice", "age":18}, {"name": "Bob", "age":19}, {"name": "Charles", "age":20}, ];
使用for循环遍历JSONArray获取数据:
for(let i = 0; i < persons.length; i++) { console.log(persons[i].name + " : " + persons[i].age); }
使用for-in循环遍历JSONArray获取数据:
for(let key in persons) { if(persons.hasOwnProperty(key)) { console.log(persons[key].name + " : " + persons[key].age); } }
使用forEach方法遍历JSONArray获取数据:
persons.forEach(function(person) { console.log(person.name + " : " + person.age); });
八、遍历JSONObject的方式
使用for循环遍历JSONObject:
for(let key in fruit) { console.log(key + " : " + JSON.stringify(fruit[key])); }
使用for-in循环遍历JSONObject:
for(let key in fruit) { if(fruit.hasOwnProperty(key)) { console.log(key + " : " + JSON.stringify(fruit[key])); } }
九、遍历JSONObject的key
获取JSONObject的key可以使用Object.keys()方法或者使用for-in循环。
let keys = Object.keys(fruit); console.log(keys);
for(let key in fruit) { console.log(key); }
十、JS遍历JSON数组选取方法
在实际开发中,常常需要从JSON数组中选取特定的元素。以下是使用for循环和filter方法选取JSON数组中的元素:
let persons = [ {"name": "Alice", "age":18}, {"name": "Bob", "age":19}, {"name": "Charles", "age":20}, ]; let adults = []; // 保存年龄大于等于18的元素 for(let i = 0; i < persons.length; i++) { if(persons[i].age >= 18) { adults.push(persons[i]); } } console.log(adults);
使用filter方法选取JSON数组中的元素:
let adults = persons.filter(function(person) { return person.age >= 18; }) console.log(adults);在web开发中,我们总是和json打交道,本文深入的介绍了JSON的遍历方式。通过了解JSON对象,我们可以更好地理解API、配置文件和日志文本的应用,也可以使我们更好地操作JSON数据。