对象只是键值对的集合。换句话说,它们是映射到称为属性(键)的唯一标识符的数据(值)。如下面这个对象:
const tekkenCharacter = {
player: 'Hwoarang',
fightingStyle: 'Tae Kwon Doe',
human: true
};
它有三个属性,每个属性映射到一个特定的值。如果要添加其他特性,例如“origin”,可以通过将origin指定给对象来完成:
tekkenCharacter.origin = 'South Korea';
如果属性中有空格,或使用变量命名属性,则需要用中括号表示法来添加。
属性用引号括起来表示为字符串,将按所示完全添加。
tekkenCharacter['hair color'] = 'dyed orange';//没有空格时也要用引号括起来,否则会识别为变量,找不到此变量就会报错。
如果没有引号,它将作为变量进行计算,变量的值即为属性的名称。
const eyes = 'eye color';
tekkenCharacter[eyes] = 'brown';
以上添加的操作完成后,对象变成下面这样了:
{
player: 'Hwoarang',
fightingStyle: 'Tae Kwon Doe',
human: true,
origin: 'South Korea',
'hair color': 'dyed orange',
'eye color': 'brown'
};
另外,对于函数里用到的参数(这里假设形参为prop),若实参代入的是对象属性名,
则一定要使用[prop]来取对象属性,用.会报错!
因为目标对象没有prop属性!prop只是一个变量名,只是当前函数的一个形参而已!!
括号表示法非常有用,因为有时对象属性在运行之前是未知的,有时我们需要以动态的方式访问它们:
let foods = {
apples: 25,
oranges: 32,
plums: 28,
bananas: 13,
grapes: 35,
strawberries: 27
};
function checkInventory(scannedItem) {
return foods[scannedItem]; //scannedItem是变量,在这里动态地指代对象属性名
}
console.log(checkInventory("apples")); //25
删除键值对的方式:
let foods = {
apples: 25,
oranges: 32,
plums: 28,
bananas: 13,
grapes: 35,
strawberries: 27
};
delete foods.oranges;//删除只能一个个写,不能写在一行上。
delete foods.plums;
delete foods.strawberries;
console.log(foods); //{ apples: 25, bananas: 13, grapes: 35 }
检查对象是否存在某属性有两种方法,一种是使用hasOwnProperty()方法,另一种是使用in关键字。
看例子:编写函数,在传递给它的对象包含所有四个名称(Alan、Jeff、Sarah和Ryan)时返回true,否则返回false。
let users = {
Alan: {
age: 27,
online: true
},
Jeff: {
age: 32,
online: true
},
Sarah: {
age: 48,
online: true
},
Ryan: {
age: 19,
online: true
}
};
function isEveryoneHere(userObj) {
//方法一:
/*/
if(userObj.hasOwnProperty('Alan')&&
userObj.hasOwnProperty('Jeff')&&
'Ryan'in userObj&&
'Sarah'in userObj
){
return true;
}
return false;
*/
//方法二:
//every方法用于验证与hasOwnProperty方法一起使用的所有名称,从而在每次迭代期间返回值true。如果使用hasOwnProperty方法未找到至少一个名称,则every方法返回false。
return ["Alan", "Jeff", "Sarah", "Ryan"].every(name =>
userObj.hasOwnProperty(name)
);
}
console.log(isEveryoneHere(users)); //true
View Code
使用for…in语句可以遍历对象中的所有键(属性)。对象不像数组那样维护存储键的顺序,因此,在引用或访问某个键时,
键在对象上的位置或它出现的相对顺序是不相关的。
看例子:编写函数,对传进去的参数(对象)遍历全部键,然后统计各个键里的online键值为true的个数。
const users = {
Alan: {
online: false
},
Jeff: {
online: true
},
Sarah: {
online: false
}
}
function countOnline(usersObj) {
let count=0;
for(let prop in usersObj) {
if(usersObj[prop]['online']==true) {
count += 1;
}
}
return count;//注意这句要放在for循环外面,循环结束才返回总的结果。
}
console.log(countOnline(users)); //1
使用Object.keys()方法可以生成(返回)一个数组,其中包含其参数对象中存储的所有键。此方法将对象作为参数,并返回表示对象中每个
属性的字符串数组。同样,数组中的条目没有特定的顺序。
let users = {
Alan: {
age: 27,
online: false
},
Jeff: {
age: 32,
online: true
},
Sarah: {
age: 48,
online: false
},
Ryan: {
age: 19,
online: true
}
};
function getArrayOfUsers(obj) {
return Object.keys(obj);
}
console.log(getArrayOfUsers(users)); //[ 'Alan', 'Jeff', 'Sarah', 'Ryan' ]
function getArrayOfUsersSub(obj) {
return Object.keys(obj['Alan']);
}
console.log(getArrayOfUsersSub(users)); //[ 'age', 'online' ]
看一个小小的综合例子:创建含有2个参数(1个为对象1个为字符串)的函数,实现传入对象时,把字符串添加到对应的键值里,返回
添加后的对应键值。
let user = {
name: 'Kenneth',
age: 28,
data: {
username: 'kennethCodesAllDay',
joinDate: 'March 26, 2016',
organization: 'freeCodeCamp',
friends: [
'Sam',
'Kira',
'Tomo'
],
location: {
city: 'San Francisco',
state: 'CA',
country: 'USA'
}
}
};
//创建函数如下:
function addFriend(userObj, friend) {
let key1=Object.keys(userObj);
for(let i=0;i<key1.length;i++){
if(userObj[key1[i]].hasOwnProperty('friends')){
userObj[key1[i]]['friends'].push(friend);
return userObj[key1[i]]['friends'];
}
}
}
console.log(addFriend(user, 'Pete')); //[ 'Sam', 'Kira', 'Tomo', 'Pete' ]
。。。