本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

2024-11(5)

关于JS 原型语法

发布于2021-03-10 19:30     阅读(1327)     评论(0)     点赞(12)     收藏(4)


  • 原型语法

    function Student(name,id){
                this.name = name;
                this.id = id;
            }
    
            //获取对象的prototype
            Student.prototype.type = "student";
            Student.prototype.message = function(){
                console.log(this.name + "," + this.id);
            };
            //生成实例对象
            var student1 = new Student("li",111);
    
    

    直接使用一个对象字面量对原型对象进行赋值

    Student.prototype = {
         type : "student",
         message : function(){
             console.log(this.name + "," + this.id);
         }
    };
    //可以正常调用
    student1.message();
    
    

    但是,需要注意有一点,student1.constructor的指向已经发生了改变,因为Student的prototype已经被重置了,constructor的指向找不到,student1.constructor的值就变成了Object了。

    解决这一问题,很简单,就是在给Student.prototrpe的字面量对象赋值时,需要手动的将constructor属性指向正确的构造函数。

    constructor : Student //该构造函数是Student
    
    • 在定义构造函数时,使用原型对象时建议根据成员的功能不同,可以分为以下两种进行设置:

        ①私有成员,一般就是非函数成员,放到构造函数中;

        ②共享成员,一般就是函数,放到原型对象种;

      当重置了prototype时,记得修正constructor的指向

  • JS 原生构造函数的原型对象

    • 所有函数都有prototype属性对象

      JavaScript中的内置构造函数也有prototype原型对象属性:

          - Object.prototype

          - Function.prototype

          - Array.prototype

          - String.pprototype

          - Number.protoptype
          ......

      • 扩展数组的原型方法

        直接给原型对象添加一个对象字面量的值是不行的,内置构造函数有其保护机制(所以如下这种代码不允许的)。

        Array.prototype = {
            getSum = function(){
                 var sum = 0;
                 for(var i = 0;i < this.length;i++){
                    sum += this[i];
                 }
                 return sum;
            }  
        };
        console.dir(Array.prototype);
        

        直接使用Array调用prototype给其添加新属性

        Array.prototype.getSum = function(){
               var sum = 0;
                 for(var i = 0;i < this.length;i++){
                    sum += this[i];
                 }
                 return sum;
        };
        console.dir(Array.prototype);
        

        实际开发中是不允许更改JS原生内置对象。

原文链接:https://www.cnblogs.com/dreamtown/p/14509297.html




所属网站分类: 技术文章 > 博客

作者:爱出汗

链接:http://www.qianduanheidong.com/blog/article/34282/e0517b15bc82b4460c3b/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

12 0
收藏该文
已收藏

评论内容:(最多支持255个字符)