function createPerson(name,age){var o=new Object();o.name...">
最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • JavaScript高级程序设计【面向对象-创建对象】

    正文概述 掘金(西野辉夜)   2021-07-27   598
    <pre name="code" class="javascript">function createPerson(name,age){
      var o=new Object();
      o.name=name;
      o.age=age;
      o.sayName=function(){
        alert(this.name);
      };
      return o;
    }
     
    var person1=createPerson("name",32);
    var person2=createPerson("name2",34);
    

    工厂模式抽象了创建具体对象的过程,用函数来封装以特定接口创建对象的细节。但是没有解决对象识别问题。

    function Person(name,age){
      this.name=name;
      this.age=age;
      this.sayName=function(){
        alert(this.name);
      };
    }
    

    var person1=new Person("name",32); var person2=new Person("name2",34); 构造函数模式 没有显示的创建对象,直接将属性和方法赋给了this对象,没有return语句;要创建Person的新实例,必须使用new关键字,构造函数实际上会经历4个步骤:创建一个新对象,将构造函数的作用域赋给新对象(因此this就指向了这个对象),执行构造函数的代码(为这个新对象添加属性),返回新对象。在前面的例子最后,person1和person2分别保存着一个person的不同的实例。这两个对象都有一个constructor属性,该属性指向Person,如:

    
    alert(person1.constructor==Person); //true
    
    alert(person2.constructor==Person); //true
    

    我们在这个例子中创建的对象,既是Object的实例,又是Person的实例。如:

    alert(person1 instanceof Object);//true
    
    alert(person1 instanceof Person);//true
    
    alert(person2 instanceof Object);//true
    
    alert(person2 instanceof Person);//true
    

    创建自定义的构造函数意味着将来可以将它的实例标识为一种特定的类型。

    任何函数,用new来调用,那他就可以是构造函数。

    构造函数的问题在于:每定义一个函数,也就是实例化了一个对象。从逻辑角度讲,此时的构造函数也可以这样定义:

    function Person(name,age){
      this.name=name;
      this.age=age;
      this.sayName=new Function("alert(this.name);");
    }
    

    从这个角度上来看构造函数,更容易明白每个Person实例都包含有一个不同的Function实例的本质。以这种方式创建函数,会导致不同的作用域链和标识符解析,但是创建Function实例的机制相同,因此不同实例上的同名函数是不相等的。 alert(person1.sayName==person2.sayName); //false

    但是创建两个完成同样任务的Function实例的确没有必要,况且有this对象在,根本不用再执行代码前就把函数绑定到特定对象上面。

    function Person(name,age){
      this.name=name;
      this.age=age;
      this.sayName=sayName;
    }
    function sayName{
      alert(this.name);
    }
    var person1=new Person("name",32);
    var person2=new Person("name2",34);
    
    function Person(){
            }
            
            Person.prototype.name = "Nicholas";
            Person.prototype.age = 29;
            Person.prototype.job = "Software Engineer";
            Person.prototype.sayName = function(){
                alert(this.name);
            };
            //在这里写一个alert(Person.name);会返回一个Person,去试试吧~,不过这个name不是定义的name
            var person1=new Person();
            person1.sayName();//"Nicholas"
            var person2=new Person();
            person2.sayName();//"Nicholas"
            alert(person1.sayName==person2.sayName);//true
            
    

    原型模式 我们创建的每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。prototype就是通过调用构造函数而创建的那个对象的原型对象。使用原型对象的好处是可以让所有的对象实例共享它所包含的属性和方法。不必再构造函数中定义对象实例的信息,而是可以将这些信息直接添加到原型对象中。 在此,我们将sayName()方法和所有属性直接添加到了Person的prototype属性中,构造函数变成了空函数。即使如此,也仍然可以通过调用构造函数来创建新对象,而且新对象还会具有相同的属性和方法。但是与构造函数模式不同的是,新对象的这些属性和方法是由所有实例共享的。

    使用Object.getPrototypeOf()可以方便的取得一个对象的原型,而这在利用原型实现继承的情况下是非常重要的。

    每当代码读取每个对象的某个属性时,都会执行一次搜索,目标是具有给定名字的属性。搜索首先从对象实例本身开始。试过在实例中找到了具有给定名字的属性,则返回该属性的值,如果没有找到,则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性。如果在原型对象中找到了这个属性,则返回该属性的值。

    person1.name="Greg";
    
    alert(person1.name);//Greg--来自实例
    
    alert(person2.name);//Nicholas--来自原型
    
    使用delete可以完全删除实例属性
    
    delete person1.name;
    
    alert(person1,name); //Nicholas--来自原型
    
    
    使用hasOwnProperty()方法可以检测一个属性时存在于实例中还是存在于原型中。
    
    alert(person1.hasOwnProperty("name"))
    

    来自实例则返回true,来自原型则返回false

    alert("name" in person1);//true
    
    

    不管属性在原型中还是在实例中,都会返回true。

    还有一种更简单的原型语法,

    function Person(){}
     
    Person.prototype={
      name:"nicholas",
      age:29;
      sayName:function(){
        alert(this.name);
      }
    };
    

    在上面的代码中,我们将Person.prototype设置为等于一个以字面量形式创建的新对象。最终结果相同,但是有一个例外:constructor属性不再指向Person了。每创建一个函数,就会同时创建它的prototype对象,这个对象也会自动获得constructor属性。而我们在这里使用的语法,本质上完全重写了默认的prototype对象,因此constructor属性也就变成了新对象的constructor属性(指向Object构造函数),不再指向Person函数。

    var friend=new Person();
    
    alert(friend.constructor==Person); //false
    
    alert(friend.constructor==Object);//true
    
    

    如果constructor值很重要可以把它设置回来:

    function Person(){}
     
    Person.prototype={
      constructor:Person,
      name:"nicholas",
      age:29;
      sayName:function(){
        alert(this.name);
      }
    };
    
    

    利用原型,还可以重写原生对象。

    String.prototype.startsWith=function(text){
      //
    
    }
    
    

    原型模式省略了为构造函数传递初始化参数这一环节,结果所有的实例在默认情况下都取得相同的属性值。

    原型中所有属性是被很多实例共享的,但是对于包含引用类型值的属性来说,问题就比较突出了。

            function Person(){
            }
            
            Person.prototype = {
                constructor: Person,
                name : "Nicholas",
                age : 29,
                job : "Software Engineer",
                friends : ["Shelby", "Court"],
                sayName : function () {
                    alert(this.name);
                }
            };
            
            var person1 = new Person();
            var person2 = new Person();
            
            person1.friends.push("Van");
            
            alert(person1.friends);    //"Shelby,Court,Van"
            alert(person2.friends);    //"Shelby,Court,Van"
            alert(person1.friends === person2.friends);  //true
    

    起源地下载网 » JavaScript高级程序设计【面向对象-创建对象】

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元