Object.defineProperty

直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。


  1. 如果添加的属性值是数组,当使用push等方法改变数组,不会触发set

    const proxy = function(target,key){
           let value ;
    
           Object.defineProperty(target,key,{
               set(val){
                   value = val;
                   console.info('set')
               },
               get(){
                    console.info('get')
                   return value;
               }
           })
    }
    
    const obj = Object.create(null);
    
    proxy(obj,'arr');
    
    obj.arr = [];
    obj.arr.push(1);

    不会打印出

    'set'
  2. 如果添加的属性值是多层级的对象,对于深层级的修改,不会触发到set

    // 紧跟前面例子
    proxy(obj,'deepObj');
    
    obj.deepObj = {a:{b:c:1}}
    obj.deepObj.a.b.c = 2

    不会打印出

    'set'

Reflect


{} vs Object.create(null)


  1. {}原型链的上一层是Object
  2. Object.create(null) 原型链的上一层是null,没有继承的属性
  3. 所以前者会继承Object的属性、方法,比如toString,后者没有

可枚举属性


可枚举属性是指那些内部 “可枚举” 标志设置为 true 的属性,

  1. 对于通过直接的赋值和属性初始化的属性,该标识值默认为即为 true,
  2. 对于通过 Object.defineProperty 等定义的属性,该标识值默认为 false。

    const obj = Object.defineProperty({a:1},'b',{
    value:123
    })
    
    console.info(Object.keys(obj))

    只会打印出===>

    ["a"]

    如果定义b属性的时候,设置enumerable为true,就可以枚举出来啦~

Object.getOwnPropertyNames vs for...in vs Object.keys


for...in

  1. 遍历对象及其原型链上可枚举的属性
  2. 使用for...in,就是沿着原型链,一层层网上找,直到null
  3. 想查找当前实例自己有的属性,就要搭配hasOwnProperty来过滤了。

Object.keys

  1. 返回其枚举自身属性的对象
  2. 返回一个所有元素为字符串的数组,其元素来自于从给定的object上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致
  3. 返回一个所有元素为字符串的数组

Object.getOwnPropertyNames

  1. 返回自身可枚举+不可枚举的属性名
  2. 该数组对元素是 obj自身拥有的枚举或不可枚举属性名称字符串。 数组中枚举属性的顺序与通过 for...in 循环(或 Object.keys)迭代该对象属性时一致。数组中不可枚举属性的顺序未定义
  3. 在给定对象上找到的自身属性对应的字符串数组

JSON.stringify

JSON.stringify(value[, replacer [, space]])

replacer

  1. 如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理
  2. 如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中
  3. 如果该参数为 null 或者未提供,则对象所有的属性都会被序列化

space

指定缩进用的空白字符串,用于美化输出

  1. 如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格
  2. 如果该参数为字符串(当字符串长度超过10个字母,取其前10个字母),该字符串将被作为空格
  3. 如果该参数没有提供(或者为 null),将没有空格

toJSON

如果一个被序列化的对象拥有 toJSON 方法,那么该 toJSON 方法就会覆盖该对象默认的序列化行为

const a = {
    a:123,
    b:'222',
    toJSON:function(){
        return 'a'
    }
}

const b = {
    a:123,
    b:'222',
    c:{
        d:1,
        toJSON:function(){
            return 'a'
        }
    }
}

console.info(JSON.stringify(a))
console.info(JSON.stringify(b))

打印出

""a""

"{"a":123,"b":"222","c":"a"}"

JSON.parse

JSON.parse(text [,reviver ])

按照JSON的格式,

  1. 不允许结尾逗号
  2. 不允许单引号

reviver

如果是函数,它规定了在返回之前如何转换最初由解析产生的值

JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', (key, value) => {
  console.log(key);
  return value; 
});

输出

1
2
4
6
5
3

最后一个key是空,value是整个值,所以:

JSON.parse('1', (key, value) => {
  console.log(key);   // log ''
  console.log(value);  // log 1
  return value;
});

southnan0
156 声望8 粉丝

欲买桂花同载酒,终不似,少年游


« 上一篇
vue
下一篇 »
react native