JS 对象基本用法

227 阅读2分钟

声明对象

  • let obj = { 'name': 'frank', 'age': 18 }
  • let obj = new Object({'name': 'frank'})
  • console.log({ 'name': 'frank', 'age': 18 })

键名是字符串,不是标识符,可包含任意字符。引号可以省略,省略后只能写标识符。引号省略后,键名还是字符串,可以Object.keys(obj)来获得obj的所有key

不加引号获得的结果可能与预期不符

let obj = {
  1: 'a',
  3.2: 'b',
  1e2: true,
  1e-2: true,
  .234: true,
  0xFF: true
};

Object.keys(obj)会得到["1", "100", "255", "3.2", "0.01", "0.234"]

变量与属性名

key是对象的属性名,value是对象的属性值

let p1 = 'name'
let obj = { p1 : 'frank'} //这样写,属性名为 'p1'
let obj = { [p1] : 'frank' } //这样写,属性名为 'name'

不加[]的属性名会自动变成字符串,加了[]会当做变量求值

var obj = {
  [1+2+3+4]: "10";
}
// Object.keys(obj)得到["10"]

symbol也能做属性名,let a = Symbol(); let obj = { [a]: 'Hello' };

删除属性

  • delete obj.xxx;delete obj['xxx'];删除obj的xxx属性,xxx属性不在obj中
  • obj.xxx === undefined;删除obj的xxx的属性值
  • 可用'xxx' in obj;来确认这个事实

读属性(查看所有属性)

  • 查看自身所有属性 Object.keys(obj); Object.values(obj);查看自身值,Object.entries(obj);查看自身键值对
  • 查看自身+共有属性 console.dir(obj);直接打印:obj.__proto__;(隐藏属性无规定名,所以不推荐后一种方法)
  • 判断属性是自身的或共有的 obj.hasOwnProperty('toString');

查看属性

  • obj['key']; 推荐用,点语法会让人误以为key不是字符串
  • obj.key;
  • 坑人语法:obj[key];key变量值一般不为'key'

写属性(修改或增加属性)

  • let obj = {name: 'frank'}; // name 是字符串
  • obj.name = 'frank'; // name 是字符串
  • obj['name'] = 'frank';
  • obj['na'+'me'] = 'frank';
  • let key = 'name'; obj[key] = 'frank';
  • 批量赋值Object.assign(obj, {age: 18, gender: 'man'});
  • 修改或增加共有属性
    • 无法通过自身修改或增加共有属性 let obj = {}, obj2 = {} // 共有 toString; obj.toString = 'xxx'; // 只会在改 obj 自身属性 obj2.toString; // 还是原型的toString
    • 修改或增加原型上的属性 一般来说,不要修改原型,会引起很多问题
      • obj.__proto__.toString = 'xxx' ; // 不推荐用 __proto__

      • Object.prototype.toString = 'xxx';

      • let common = {kind: 'human'};
        let obj = Object.create(common);
        obj.name = 'frank';
        let obj2 = Object.create(common);
        obj2.name = 'jack';
        

        以common为原型声明obj和obj2