Home > Web Front-end > JS Tutorial > Introduction to the usage of Object.create() in JavaScript

Introduction to the usage of Object.create() in JavaScript

不言
Release: 2018-12-10 17:46:15
forward
3515 people have browsed it

This article brings you an introduction to the usage of Object.create() in JavaScript. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you. help.

The object created by Object.create(null) is an empty object, and the object does not inherit the properties or methods on the Object.prototype prototype chain

For example: toString(), hasOwnProperty( ) and other methods

Parameters Description
obj Create the prototype of the object, indicating the object to be inherited
propertiesObject (optional) is also an object used to initialize newly created objects

Let’s take a look at the underlying implementation

    Object.create =  function (o) {
        var F = function () {};
        F.prototype = o;
        return new F();
    };
Copy after login

Let’s take a look at the specific application:

    //创建一个Obj对象
    var Obj ={
        name:'mini',
        age:3,
        show:function () {
            console.log(this.name +" is " +this.age);
        }
    }

    //MyObj 继承obj, prototype指向Obj
    var MyObj = Object.create(Obj,{
        like:{
            value:"fish",        // 初始化赋值
            writable:true,       // 是否是可改写的
            configurable:true,   // 是否能够删除,是否能够被修改
            enumerable:true      //是否可以用for in 进行枚举
        },
        hate:{
            configurable:true,
            get:function () { console.log(111);  return "mouse" }, // get对象hate属性时触发的方法
            set:function (value) {                                 // set对象hate属性时触发的方法 
                console.log(value,2222);
                return value;
            }    
        }
    });
Copy after login
Focus: The get and set methods here seem to contain greater potential. We can use them to implement data filtering and data binding. Achieve some simple mvvm effects

Application of Object.create inheritance:

    var A = function () { };
    A.prototype.sayName=function () {
        console.log('a');
    }

    // B的实例继承了A的属性
    var B = function () { };
    B.prototype = Object.create(A.prototype);
    var b = new B();
    b.sayName();  // a
Copy after login

Key point: Compared with the inheritance of the constructor, Object.create inheritance realizes the perfect separation of the prototypes of A and B. Both parties will not affect each other. This is the highlight of Object.create

The above is the detailed content of Introduction to the usage of Object.create() in JavaScript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:segmentfault.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template