<JS>学习笔记(Object)

作者: 泡沫的快乐 | 来源:发表于2017-06-15 19:19 被阅读48次

    新人学习JS的日记。

    欢迎各位朋友纠错!

    以下内容都在谷歌浏览器进行测试可用
    一些方法是ES6的,要用babel转码才能用(不过最新版本谷歌浏览器已经支持90%的ES6语法了,基本都可以使用).

    >>语法
    let a = 'str' , b = function(){} , obj = {};
    字面量语法
    1: obj = {  //直接设置属性,方法
        a: 'str',
        b: function(){}
    } 
    2: obj = {  
        a: a,
        b: b
    }
    3: obj = { //ES6
        a, //可以将变量,直接设置为属性. 
        b,
        func(arg){}, //方法可以不写'function'关键字,直接写 函数名(){};
        ['test' + a]: b //可以将写动态属性名,
        get property(){}, // 直接设置geter,setter方法.
        set property(val){}, 
    }
    
    用Object构造函数
    obj = new Object([val])
    1: 不写参数或 val为null,undefined, 返回一个空对象
    2: val是什么类型,返回什么类型对象.
    
    >>静态方法

    ① 创建对象

    >> Object.assign(target, ...sources) -- 将所有源对象的可枚举属性,复制到目标对象.
    1: target: 必填object类型的值. 
    2: ...sources: (多个)源对象.
    3: 拷贝规则: 调用sources的[[GET]]方法 , target的[[SET]]方法 , 更像 直接赋值 而不是 复制值.  基本类型会转换封装类型.
    4: 只拷贝sources本身的<可枚举>的属性,其原型链上的不拷贝. 
    5: 若target有相同的属性(非只读属性),会被后来的sources的属性覆盖. 若属性是只读属性,报错.
    6: sources为null,undefined 跳过,进行下一个.
    7: 注意:拷贝为浅拷贝. 也就是说:若sources的属性有object类型,只会复制其引用. 而不是复制一个object.
    8: 返回target对象.
    
    >> Object.create(proto, [ propertiesObject ]) -- 用原型对象(和配置属性),创建一个新对象.
    1: proto:一个对象,作为新对象的原型.
    2: propertiesObject: 给新对象设置属性,和具体内部配置.例如:
       { //具体看 Object.defineProperty()
        'attrName' : {
            value:'attrVal',
            writable: true ,
            set:function(val){}
        }
    3: proto不是null或则对象,则报错.
    4: proto是null的时候,会返回一个没有原型的对象,也就是说该对象没有任何属性,方法可以调用,全部都得自己定义.
    4: 返回新对象
    

    ② 遍历对象

    >> Object.keys(obj) -- 查看对象的可枚举属性.
    1: 要查看其枚举属性的对象.
    2: 返回对象的可枚举属性的字符串数组.
    3: 值在数组中的排列顺序与for...in遍历顺序一致(区别在于for...in也会枚举原型链中的属性).
    4: 例: Object.keys( {a:1,b:2} ) // ["a", "b"]
    
    >> Object.values() -- 查看对象的可枚举属性的值.(ES7规范提案中,谨慎使用)
    1: 要查看其枚举属性的对象.
    2: 返回对象的可枚举属性的值的数组.
    3: 值在数组中的排列顺序与for...in遍历顺序一致(区别在于for...in也会枚举原型链中的属性).
    4: 例:Object.values({a:1,b:2}) // [1,2]
    
    >> Object.entries(obj) -- 查看对象的键值对(可枚举的).
    1: obj: 要查看的对象.
    2: 返回由 [key, value](可枚举的) 组成的数组.
    3: 键值对在数组中的排列顺序与for...in遍历顺序一致(区别在于for...in也会枚举原型链中的属性).
    4: 例: let o = {a:1,b:2};   Object.entries(o) // [ ["a", 1], ["b", 2] ]
    

    ③ 比较,原型

    >>Object.is(val1, val2) -- 判断是否为相同值.
    1: 比较不进行类型转换.
    2: 基本与 === 情况相同,区别如下:
       NaN与NaN,返回true.
       +0与-0,返回false.
       -0与-0,返回true.
       +0与+0,返回true,
    3: 除非必要情况,否则不要使用此方法,因为性能不如 ===
    
    >> Object.getPrototypeOf(obj) -- 获取对象原型
    1: obj:要返回其原型的对象.
    2: 返回其原型,如果没有则返回null.
    
    >> Object.setPrototypeOf(obj, prototype)
    1: obj:要设置其原型的对象. prototype:新原型(对象或null)
    2: 不推荐使用此方法,可能会影响其它代码,性能也是问题. 应该使用Object.create()创建对应原型的对象.
    3: 若对象是不可拓展的,会报错.
    

    ④ 对象属性
    属性描述符具体情况:Object.defineProperty

    ①中的Object.create() 也可以配置对象属性.
    >> Object.defineProperty(obj, attr, descriptor) -- 配置对象单个属性
    1: obj:在此对象上配置属性. attr:要定义/修改的属性. descriptor:属性描述符对象.  描述符分为:数据描述符 , 存取描述符 
    2: <数据描述符>和<存取描述符>均具有以下可选键值:
       configurable: 布尔值 // true:该属性可被改变,可被删除. 默认为false.
       enumerable: 布尔值 // true:该属性可被枚举. 默认为false.
       <数据描述符>可选键值:
       value: 任何有效的JS值. 默认为undefined. //该属性的值
       writable: 布尔值. // true: 值可以被赋值运算符改变. 默认为false.
       <存取描述符>可选键值:
       get: 在获取属性值时,返回此方法的函数返回值.  默认为undefined.
       set: 在修改属性值时,此方法的函数返回值,成为属性的新值.  默认为undefined.
    3: 具体请看标题下有地址[Object.defineProperty](http://www.jianshu.com/p/5eeba874d473)
    
    
    >> Object.defineProperties(obj, props) -- 配置对象多个属性
    1: obj:在此对象上配置属性. props: 多个属性要配置的属性描述符对象.
    2: 规则同Object.defineProperty().
    3: 例子: Object.defineProperties(obj, {
       "attr": {
        value: true,
        writable: true
      },
      "attr2": {
        value: "Hello",
        writable: false
      }
    }); 
    
    >> Object.getOwnPropertyDescriptor(obj, attr) -- 返回指定对象的指定属性的属性描述符.
    1: obj: 要查看属性的对象. attr: 要查看的属性.
    2: 返回描述符对象. 若obj不存在attr属性返回undefined.
    3: 例: Object.getOwnPropertyDescriptor({a:1},'a') // Object {value: 1, writable: true, enumerable: true, configurable: true}
     
    >> Object.getOwnPropertyNames(obj) -- 返回对象由自身的所有属性名(包括不可枚举的)组成的数组
    1: obj:要查看的对象.
    2: 返回给定对象上找到的属性对应的字符串数组。
    3: 例: Object.getOwnPropertyNames({a:1,b:2}) // ["a", "b"]
    
    >> Object.getOwnPropertySymbols(obj) -- 对象的symbol属性键
    1: obj: 要查看的对象.
    2: 返回所有stmbol类型属性键.
    

    ⑤ 冻结,密封,禁止拓展.

    >> Object.freeze(obj) -- 冻结对象
    1: obj:要被冻结的对象.
    2: 冻结指的是:
       不能给对象添加新属性.
       不能修改,删除已有属性.
       不能修改属性的可枚举性、可配置性、可写性.
       若属性的值是对象,则该对象的属性不会被冻结,你可以对其进行冻结.
    3: 冻结后修改属性会静默失败,严格模式下会报错.
    4: 返回冻结后的对象.
    
    >> Object.seal(obj) -- 密封对象
    1: obj:要被密封的对象.
    2: 密封指定与冻结的唯一区别.
       属性的值,可以进行修改,其余相同.
    3: 返回密封后的对象.
    
    >> Object.preventExtensions(obj)
    1: obj: 要设置为不可扩展的对象.
    2: 不可拓展是指,不可以添加新的属性. 可以删除,修改.
    3: 返回设置后的对象.
    
    >> Object.isFrozen(obj)
    1: obj:要检测的对象.
    2: 一个对象是冻结的(frozen)是指它不可扩展
    ,所有属性都是不可配置的(configurable),且所有数据属性(properties)都是不可写的(writable). 数据属性是指那些没有取值器(getter)或赋值器(setter)的属性。
    3: 例:  一个不可拓展(密封)的<空对象> ,冻结后的对象都返回true.
    4: 符合2情况,返回treu,否则返回false.
    
    >> Object.isExtensible(obj) -- 检测对象是否可拓展
    1: obj:要检测的对象.
    2: 不可拓展返回true ,反则返回false
       冻结,密封,不可拓展,都会返回true,
    
    >> Object.isSealed(obj) -- 是否是被密封的
    1: obj:要检测的对象.
    2: 如果对象是密封的返回true,否则返回false. 
       密封对象是指那些不可拓展的,且自身属性都不可配置(configurable)且属性不可删除的对象(其可以是可写的).
    
    >>实例方法(原型的方法,方法都在原型上定义)
    let obj = {a:1,b:2}
    
    >> obj.hasOwnProperty(attr) -- 对象是否有指定属性(而不是其原型有).
    1: attr:要检测的属性(字符串或者Symbol).
    2: 和 in 运算符不同,in会去查看原型链的属性.
    3: for...in中使用其进行筛选.
    4: 有则返回true,无则返回false.
    
    >> obj.propertyIsEnumerable(attr) -- 属性是否可以枚举.
    1: attr: 要检测的属性.
    2: 可以被枚举返回true,反则返回false.
    
    >> prototypeObj.isPrototypeOf(obj) -- 检测prototypeObj对象是否在obj的原型链上.
    1: obj: 在该对象的原型链上查找. prototypeObj: 一个原型对象.
    2: 是则返回treu,否则返回false.
    3: 与instanceof不同. instanceof是检测是否是obj的构造函数.
    
    >> obj.toString() -- 该对象的字符串形式.
    1: obj: 一个对象.
    2: 返回该对象的字符串形式.
    
    >> obj.valueOf() -- 返回该对象的原始值.
    1: obj: 一个对象.
    2: 返回该对象的原始值.
    
    >>实例属性
    >> obj.constructor -- 对象的构造函数
    1: obj: 对象.  
    2: 返回该对象的构造函数.
    3: DOM对象也可以. 例如:
       document.constructor // function HTMLDocument() { [native code] }
    4: 此对象可以手动改变.
    
    >> obj.__proto__ -- 对象原型,和构造函数的prototype指向同一对象
    1: obj:对象.
    2: 不鼓励使用,建议使用getPrototypeOf()
    

    以上是我所知的的东西,有任何错误,请在评论指出!
    O(∩_∩)O谢谢你的观看~

    相关文章

      网友评论

      本文标题:<JS>学习笔记(Object)

      本文链接:https://www.haomeiwen.com/subject/ywrrqxtx.html