js中.和[]的区别

Posted 2020-11-29 残梦

在js中,对象属于是键值对的集合

//例如
const obj = {
    name: '残梦',
    say:function(){
        console.log('你好')
    }
}

在上面这个代码中,name就属于是key,而‘残梦‘就是value

如何获取对象属性

第一种方式: .语法

• student.name 获取到student的name属性
• student.say 获取一个函数

第二种语法: []语法

• student["name"] 等价于student.name
• student["say"] 等价于student.say

他们两者究竟有何差异呢?

• 语法很方便,但是有很多的坑,比如:

1. .后面不能使用js的关键字,例如:(class,this,function)
2. .后面不能有数字

var obj={};
obj.this=5; //语法错误
obj.0=10;   //语法错误

• []使用更加广泛

1. o1[name]
2. [‘class‘],[‘this‘]也可以随意的去使用obj[‘this‘]=10
3. [1],[2]也可以使用obj[3]=10
4. 也可以这样用 ["{abc}"] 给对象添加了{abc}属性

设置属性时的差异?

• student[‘name‘] <=> student.name
• 第一种设置的时候,如果student没有name属性,就会添加一个name属性
• 但是第二种不会,所以一般更加推荐使用[]这种方式

小结

总之一句话: []更强大,.就是用起来更加习惯一些,一开始用[]的时候总是会当成数组,需要注意一下