美文网首页程序员
JS中的静态属性及实例属性

JS中的静态属性及实例属性

作者: shandamengcheng | 来源:发表于2020-04-25 12:12 被阅读0次

    在回忆怎么判断一个对象是一个数组的方法时,想到了Array.isArray()这个方法,突然有点不理解,这是什么意思,isArray()怎么可以通过Array直接调用,这样的情况很多,比如Object上的方法。
    看了几篇文章,简单理解是:JS中有“静态属性”和实例属性。

    function Person(name) {this.name = name}
    Person.setName = (name) =>{this.name = name}
    var per = new Person()
    per.setName()   //Uncaught TypeError: per.setName is not a function
    

    静态属性

    定义在构造函数上的属性。只能通过构造函数名来调用。
    那么就是说,上面的setName方法可以通过Person来调用,不能通过实例调用。因为setName是其内部方法。 举个例子:

    function Person() {
        this.age = 20;
    }
    Person.getName = ()=>{return this.name}
    Person.name = "Jona";
    var p = new Person();
    

    通过打印p,可以看到:

    Person {age: 20}
    age: 20
    __proto__:
        constructor: ƒ Person()
            getAge: () =>{ return this.age; }
            myName: "Jona"
            length: 0
            name: "Person"
            arguments: null
            caller: null
            prototype: {constructor: ƒ}
            __proto__: ƒ ()
            [[FunctionLocation]]: VM1711:1
            [[Scopes]]: Scopes[1]
        __proto__: Object
    

    可以发现,myName和getAge属性并没有被实例所继承。

    实例属性

    我的理解是:定义在构造函数原型上的属性及在构造函数内部绑定到this上的属性。这些属性可以通过实例对象直接调用。

    function Person(){
        this.name = "Jona";
        this.age = 20;
    }
    Person.prototype.getName = function(){
        return this.name;
    }
    var p = new Person();
    

    这个时候,p可以调用name,age,getName这些属性。

    查看

    可以通过Object.getOwnpropertyNames()等此类方法查看有哪些属性。

    Object.getOwnPropertyNames(Array);
    
    //["length", "name", "prototype", "isArray", "from", "of"]
    
    Object.getOwnPropertyNames(Array.prototype);
    
    //["length", "constructor", "concat", "copyWithin", "fill", "find", "findIndex", "lastIndexOf", "pop", "push", "reverse", "shift", "unshift", "slice", "sort", "splice", "includes", "indexOf", "join", "keys", "entries", "values", "forEach", "filter", "flat", "flatMap", "map", "every", "some", "reduce", "reduceRight", "toLocaleString", "toString"]
    

    相关文章

      网友评论

        本文标题:JS中的静态属性及实例属性

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