JS 对象基本用法

在JavaScript中，对象是一种非常重要的数据类型。在这篇博客中，我们将介绍对象的基本用法，包括声明对象的两种语法、如何删除对象的属性、如何查看对象的属性、如何修改或增加对象的属性，以及'name' in obj和obj.hasOwnProperty('name')的区别。

声明对象的两种语法

在JavaScript中，声明一个对象有两种语法：

字面量语法（Object Literal） ：使用大括号{}创建一个空对象，然后通过逗号,分隔的键值对（key-value pairs）为对象添加属性。
```
javascriptCopy code
let obj1 = {
  name: '张三',
  age: 30,
  city: '上海'
};
```
构造函数语法（Constructor） ：使用new关键字创建一个对象实例，然后通过点.符号为对象添加属性。
```
javascriptCopy code
let obj2 = new Object();
obj2.name = '张三';
obj2.age = 30;
obj2.city = '上海';
```

细节

键名是字符串，不是标识符，可以包含任意字符
引号可省略，，省略之后就只能写标识符
就算引号省略了，键名也还是字符串（重要）

如何删除对象的属性

在JavaScript中，可以使用delete关键字删除对象的属性：

javascriptCopy code
let obj = {
  name: '张三',
  age: 30,
  city: '上海'
};

delete obj.age;
console.log(obj); // {name: '张三', city: '上海'}

如何查看对象的属性

要查看对象的属性，可以使用点.符号或方括号[]操作符：

Object.keys(obj)
console.dir(obj)
obj['name']
obj.name  // 字符串
obj[name] // 变量

如何修改或增加对象的属性

要修改对象的属性值，可以使用点.符号或方括号[]操作符赋予新值。如果对象不存在该属性，将会添加新属性：

javascriptCopy code
let obj = {
  name: '张三',
  age: 30,
  city: '上海'
};

obj.age = 25;
console.log(obj.age); // 25

obj.country = '中国';
console.log(obj.country); // '中国'

批量赋值

Object.assign(obj, {age:18, gender: 'man'}

'name' in obj 和 obj.hasOwnProperty('name') 的区别

虽然'name' in obj和obj.hasOwnProperty('name')都可以用来检查对象是否具有某个属性，但它们之间存在一些差异：

'name' in obj：检查对象自身及其原型链上是否存在指定的属性。
obj.hasOwnProperty('name')：仅检查对象自身是否存在指定的属性，不考虑原型链。

javascriptCopy code
let obj = {
  name: '张三',
  age: 30
};

console.log('name' in obj); // true
console.log(obj.hasOwnProperty('name')); // true

console.log('toString' in obj); // true，因为toString是从Object.prototype继承的属性
console.log(obj.hasOwnProperty('toString')); // false，因为obj自身并没有定义toString属性

以下是一个更详细的例子，说明这两种方法的区别：

javascriptCopy code
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

let person1 = new Person('张三', 30);

console.log('name' in person1); // true
console.log(person1.hasOwnProperty('name')); // true

console.log('sayHello' in person1); // true，因为sayHello是从Person.prototype继承的属性
console.log(person1.hasOwnProperty('sayHello')); // false，因为person1自身并没有定义sayHello属性

在使用'name' in obj和obj.hasOwnProperty('name')时，需要根据具体需求选择合适的方法。如果需要检查对象自身及其原型链上是否存在某个属性，可以使用'name' in obj；如果仅关心对象自身是否具有某个属性，可以使用obj.hasOwnProperty('name')。

总结：本文介绍了JS对象的基本用法，包括声明对象的两种语法、如何删除对象的属性、如何查看对象的属性、如何修改或增加对象的属性，以及'name' in obj和obj.hasOwnProperty('name')的区别。理解这些基本概念对于掌握JavaScript中的对象操作非常重要。希望这篇文章对你有所帮助。