zoukankan      html  css  js  c++  java
  • ES6入门之对象扩展

    ES5对象(超类)原有:

    属性:construct构造函数

    方法:

    object.hasOwnProperty( propertyName )  //检测是否有一个本地的属性而不是继承的,返回boolen
    prototypeObject.isPrototypeOf( object )  //检测指示对象是否存在于另一个对象的原型链中,返回boolen
    propertyIsEnumerable()  //指定属性是否为对象的一部分以及该属性是否是可枚举的,返回boolen
    var arr = [1, 2];
     arr.propertyIsEnumerable( 1 ) ; // true
    // 数组的length为内置属性
     arr.propertyIsEnumerable( "length" )  // false
    object.valueOf( )  //返回指定对象的原生值
    // Date:当前时间距1970年1月1日午夜的毫秒数
    var date = new Date(2013, 7, 18, 23, 11, 59, 230);
     date.valueOf() ; // 1376838719230
    
    // Number:返回数字值
    var num =  15.26540;
     num.valueOf() ; // 15.2654

    静态方法:


    property特征:

    1. value:值,默认是undefined

    2. writable:是否可更改,默认是false

    3. enumerable:是否可以被枚举(for in),默认false

    4. configurable:是否可以被删除,默认false

    get/set不能和value、writable同时使用

    5.get:返回property的值得方法,默认是undefined

    6.set:为property设置值的方法,默认是undefined


    Object.create(prototype[,descriptors])  //通过指定原型及属性创建一个新对象

    var d = Object.create({a:1});
    console.log(d);  //Object {a:1}
    var e = Object.create(Array);
    console.log(e);  //Function {}

    Object.defineProperties()  //创建或配置多个属性

    Object.defineProperty()  //创建或配置某个属性

    var o = {};   //这里的o对象必须提前定义  
    //多个属性
    Object.defineProperties(o, {
                'age': {
                    value: 24,
                    writable: true,
                    enumerable: true,
                    configurable: true
                },
                'sex': {
                    value: 'male',
                    writable: false,
                    enumerable: false,
                    configurable: false
                }
            });
    console.log(o);    //Object {age: 24, sex: "male"}
    
    //单个属性
    Object.defineProperty(o,'age', {
                value: 24,
                writable: true,
                enumerable: true,
                configurable: true
            });

     Object.getOwnPropertyDescriptor(obj,property)  //获取指定对象的指定属性

    var props = Object.getOwnPropertyDescriptor(o, 'age');
            console.log(props); //Object {value: 24, writable: true, enumerable: true, configurable: true}

    Object.getOwnPropertyNames()  //返回指定对象的所有非继承包括不可枚举属性名的数组

    console.log(Object.getOwnPropertyNames(o)); //["age", "sex"]

    Object.getPrototypeOf()  //返回指定对象的原型

    Object.keys()  //返回指定对象所有非继承可枚举属性名的数组(注意与getOwnPropertyNames的区别)

    Object.preventExtensions(obj)//阻止向指定对象添加新的属性,但是仍可以更改旧的属性

    Object.isExtensible(obj) //检测对象是否可以添加新的属性

    Object.seal(obj)  //阻止向指定对象添加新属性或者是删除现有属性

    Object.isSealed(obj)  //检测是否密封

    Object.freeze(obj)  //完全冻结,属性的一切操作均无效

    Object.isFrozen(obj)  //是否已冻结

    ES6对象的扩展

     属性的简化:

    ES6允许直接写入变量和函数,作为对象的属性和方法

    var birth = '2000/01/01';
    
    var Person = {
    
      name: '张三',
    
      //等同于birth: birth
      birth,
    
      // 等同于hello: function ()...
      hello() { console.log('我的名字是', this.name); }
    
    };

    注意,属性名表达式与简洁表示法,不能同时使用,会报错。

    // 报错
    var foo = 'bar';
    var bar = 'abc';
    var baz = { [foo] };
    
    // 正确
    var foo = 'bar';
    var baz = { [foo]: 'abc'};

    函数的name属性,返回函数名。对象方法也是函数,因此也有name属性。如果使用了取值函数,则会在方法名前加上get。如果是存值函数,方法名的前面会加上set

    var person = {
      sayName() {
        console.log(this.name);
      },
      get firstName() {
        return "Nicholas"
      }
    }
    
    person.sayName.name   // "sayName"
    person.firstName.name // "get firstName"

    有两种特殊情况:bind方法创造的函数,name属性返回“bound”加上原函数的名字;Function构造函数创造的函数,name属性返回“anonymous”。

    (new Function()).name // "anonymous"
    
    var doSomething = function() {
      // ...
    };
    doSomething.bind().name // "bound doSomething"

    如果对象的方法是一个Symbol值,那么name属性返回的是这个Symbol值的描述

    const key1 = Symbol('description');
    const key2 = Symbol();
    let obj = {
      [key1]() {},
      [key2]() {},
    };
    obj[key1].name // "[description]"
    obj[key2].name // ""

    Object.is()

    +0 === -0 //true
    NaN === NaN // false
    
    Object.is(+0, -0) // false
    Object.is(NaN, NaN) // true

    Object.assign()第一个参数是目标对象,后面的参数都是源对象。用于对象合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。

    注意,如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

    var target = { a: 1, b: 1 };
    
    var source1 = { b: 2, c: 2 };
    var source2 = { c: 3 };
    
    Object.assign(target, source1, source2);
    target // {a:1, b:2, c:3}

    只有一个参数则返回参数,如果这个参数不为对象,则直接转为对象,但是undefined和null不可以。

  • 相关阅读:
    js防止按钮被多次点击
    jQuery:localStorage用法
    jQuery Ajax 前端和后端数据交互的问题
    <img>总结: 动态创建等问题
    jQuery
    Echarts 饼图(series)标题文字太长的换行设置
    echarts 为x轴、y轴添加滚动条
    video.js的应用
    关于跨域问题的详解
    麻省理工18年春软件构造课程阅读04“代码评审”
  • 原文地址:https://www.cnblogs.com/sker/p/5462694.html
Copyright © 2011-2022 走看看