1.JS查询对象数组中属性值符合的对象
JS查询对象数组中属性值符合的对象,可以使用findIndex方法。假设对象数组objs,查找其中id是34的对象:
let index = objs.findIndex(item => {
return item.id == 34;
})
2.快速赋值
var obj = {
name:"zhangsan",
age:18
};
// 此时变量值name="zhangsan",age=18
let {name, age} = obj;
3.字符串拼接
'我的名字是${name},我的年龄是${age}'
4.对象的解构
在JavaScript中,可以使用解构赋值(destructuring assignment)来将对象的属性分配给变量。解构赋值是一种方便的语法,可以让你直接从数组或对象中提取值并分配给变量。
以下是一个简单的例子,展示了如何使用解构赋值从对象中提取属性:
javascriptconst myObject = {
name: 'John',
age: 30,
city: 'New York'
};
// 解构赋值语法
const { name, age, city } = myObject;
// 输出结果
console.log(name); // John
console.log(age); // 30
console.log(city); // New York
在这个例子中,我们使用解构赋值语法将myObject
对象的属性分配给了三个变量:name
、age
和city
。然后,我们可以直接使用这些变量来访问对象中的属性。
解构赋值语法也可以嵌套使用,以提取嵌套对象的属性。例如:
javascriptconst myNestedObject = {
name: 'John',
address: {
street: '123 Main St',
city: 'New York',
state: 'NY',
zip: '10001'
}
};
// 解构嵌套对象的属性
const { name, address: { city, state, zip } } = myNestedObject;
// 输出结果
console.log(name); // John
console.log(city); // New York
console.log(state); // NY
console.log(zip); // 10001
在这个例子中,我们使用解构赋值语法嵌套提取了myNestedObject
对象中的属性。首先,我们提取了name
属性,然后我们使用了另一个解构赋值语法来提取address
对象的属性。在嵌套解构中,我们可以使用多个变量来分别提取不同级别的属性。
5.对象展开符
在JavaScript中,对象展开符(Object rest/spread)是一种语法,允许你从数组或对象中提取出剩余的属性。
在ES6及以后的版本中,你可以使用 ...
符号来创建一个新的对象,其中包含源对象的剩余属性。这可以与Object.assign()
方法一起使用。
例如:
javascriptlet obj1 = { a: 1, b: 2 };
let obj2 = { ...obj1, c: 3 };
console.log(obj2); // { a: 1, b: 2, c: 3 }
在这个例子中,...obj1
是一个对象展开符,它把 obj1
的所有属性复制到了新的对象中。然后,我们添加了一个新的属性 c
,最终的结果是一个新的对象 { a: 1, b: 2, c: 3 }
。
注意,如果源对象和目标对象有相同的属性,那么使用对象展开符会覆盖目标对象的属性值。
此外,对象展开符还可以与默认值一起使用,以避免从源对象复制属性时出现 undefined
值。
javascriptlet obj1 = { a: 1, b: 2 };
let obj2 = { ...obj1, c: 3, d: 4 };
console.log(obj2); // { a: 1, b: 2, c: 3, d: 4 }
在这个例子中,d
属性在源对象 obj1
中并不存在,因此在复制时被赋予了默认值 undefined
。但是,由于在目标对象中有 d: 4
,所以最终 d
的值是 4
。
6.遍历对象的属性
在JavaScript中,您可以使用多种方法来遍历对象的属性。以下是一些常见的方法:
1.使用for...in循环:
javascriptlet obj = {a: 1, b: 2, c: 3};
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(`Key is ${key}, value is ${obj[key]}`);
}
}
这个循环将遍历对象中的所有可枚举属性,包括其原型链上的属性。因此,如果对象继承了其他对象的属性,那么这些属性也会被遍历到。
2.使用Object.keys()方法:
javascriptlet obj = {a: 1, b: 2, c: 3};
Object.keys(obj).forEach(key => {
console.log(`Key is ${key}, value is ${obj[key]}`);
});
Object.keys()方法将返回一个包含对象自身所有可枚举属性键的数组,然后你可以使用forEach()方法来遍历这个数组。
3.使用Object.entries()方法:
javascriptlet obj = {a: 1, b: 2, c: 3};
Object.entries(obj).forEach(([key, value]) => {
console.log(`Key is ${key}, value is ${value}`);
});
Object.entries()方法将返回一个包含对象自身所有键值对的数组,然后你可以使用forEach()方法以及数组解构来遍历这个数组。
4.使用for...of循环:
javascriptlet obj = {a: 1, b: 2, c: 3};
for (let [key, value] of Object.entries(obj)) {
console.log(`Key is ${key}, value is ${value}`);
}
for...of循环可以遍历任何可迭代对象,包括由Object.entries()返回的数组。在这种情况下,它将遍历每个键值对,其中键和值分别作为数组的第一个和第二个元素。
7.解构赋值
这是 JavaScript 中的解构赋值语法。通过使用 let {a} = obj
,你可以从 obj
对象中提取出键为 'a'
的值,并将其赋值给变量 a
。这种语法允许你直接将对象的属性值赋值给相应的变量,无需显式地使用 obj.a
形式的属性访问。
let {a=0} = obj
上面代码中,如果没有从obj中解构出obj,则a被赋值0。