JavaScript 对象基本语法
前言: 涉及内容
- 声明对象的两种语法
- 如何删除对象的属性
- 查看对象的属性
- 如何修改或增加对象的属性
- 'name' in obj 和 obj.hasOwnProperty('name') 的区别
声明对象的两种语法
- 第二种比较正规,第一种方便。
- 中括号语法 1. obj['key'] 等价于 obj.key, 此时的 key 是一个字符串。 2. obj[name] 请注意这时候的 name 是一个变量。tips:对象得键名key只能是字符串。
let obj = {};
let obj2 = new Object();
- symbol 也可以作为属性
let a = Symbol();
let obj = { [a]: "hello" };
console.log(obj);
删除对象的属性 只能删除对象的属性
<!-- 删除整个键值对 -->
let obj2 = new Object();
obj2.name = "张三";
delete obj2.name;
console.log(obj2);
<!-- value 为undefined,键值key还在 -->
let obj3 = {
name: "李四",
};
obj3.name = "undefined";
console.log(obj3);
查看对象的属性
- console.dir(obj) 打印对象的目录
- Object.entries() 返回一个数组,以键值对的形式
- Object.keys() 返回一个数组,自身的 key 属性组合成的。
修改或者增加对象的属性
- 增加多个对象的属性,以键值对的形式
let obj4 = {
name: "123",
};
console.log(Object.assign(obj4, { a: 2, b: 3, c: 4 }));
- 在对象的原型上 prototype 增加
Object.prototype.hello = "hello";
let obj = {};
console.log(obj);
- 不推荐使用 proto 修改共有属性。并且无法通过自身修改或增加共有属性。因为每个浏览器叫法不一(firefox和chrome浏览器就不一样),并且规范不支持这种写法。
- 推荐使用 Object.create()
- 读的时候会查看隐藏属性_proto_ 但是写入的时候并不会改变隐藏属性。
// obj2 上没有person
let obj2 = {};
const person = {
isHuman: false,
printIntroduction: function () {
console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
},
};
const me = Object.create(person);
me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten
me.printIntroduction();
console.log(me);
针对第五条:读的时候会查看隐藏属性_proto_ 但是写入的时候并不会改变隐藏属性。(原型_proto_)
//也就是说 并不会改变原型上的共有属性
let obj1={}
obj1.toString='1234'
let obj2={}
console.log(obj2.toString()) // [object Object]
'name' in obj 和 obj.hasOwnProperty('name') 的区别
- obj.hasOwnProperty('name') 查看属性是否是独有的。
- 'name' in obj 缺点是不能知道是自己的还是共有的
- obj.name==="undefined" 只能够判断 属性值
let obj = {
name: "undefined",
};
console.log("name" in obj); //true
console.log(obj.hasOwnProperty("name"));
console.log("toString" in obj); //true