• JavaScript对象 创建对象(一)


    创建对象  --以下内容来自JavaScript高级程序设计

    工厂模式

    用函数来封装以特定接口创建对象的细节。

            function createPerson(name, age, job){
                var o = new Object();
                o.name = name;
                o.age = age;
                o.job = job;
                o.sayName = function(){
                    alert(this.name);
                };    
                return o;
            }
            
            var person1 = createPerson("Nicholas", 29, "Software Engineer");
            var person2 = createPerson("Greg", 27, "Doctor");
            
            person1.sayName();   //"Nicholas"
            person2.sayName();   //"Greg"

    构造函数
    用来创建特定类型的对象

            function Person(name, age, job){
                this.name = name;
                this.age = age;
                this.job = job;
                this.sayName = function(){
                    alert(this.name);
                };    
            }
            
            var person1 = new Person("Nicholas", 29, "Software Engineer");
            var person2 = new Person("Greg", 27, "Doctor");
            
            person1.sayName();   //"Nicholas"
            person2.sayName();   //"Greg"
            
            alert(person1 instanceof Object);  //true
            alert(person1 instanceof Person);  //true
            alert(person2 instanceof Object);  //true
            alert(person2 instanceof Person);  //true
            
            alert(person1.constructor == Person);  //true
            alert(person2.constructor == Person);  //true
            
            //不同实例的同名函数是不相等的,每个方法都要在每个实例上重新创建一次。
            alert(person1.sayName == person2.sayName);  //false 
            function Person(name, age, job){
                this.name = name;
                this.age = age;
                this.job = job;
                this.sayName = sayName;
            }
            
            //把函数定义转移到构造函数外部,作为全局函数,没有封装性
            function sayName(){
                alert(this.name);
            }
            
            var person1 = new Person("Nicholas", 29, "Software Engineer");
            var person2 = new Person("Greg", 27, "Doctor");
            
            person1.sayName();   //"Nicholas"
            person2.sayName();   //"Greg"
            
            alert(person1 instanceof Object);  //true
            alert(person1 instanceof Person);  //true
            alert(person2 instanceof Object);  //true
            alert(person2 instanceof Person);  //true
            
            alert(person1.constructor == Person);  //true
            alert(person2.constructor == Person);  //true
            
            alert(person1.sayName == person2.sayName);  //true   

     原型模式

    每个函数都有一个原型属性,它指向一个对象,这个对象包含由特定类型实例共享的属性和方法。使用原型对象可以使所有对象实例共享它所包含的属性和方法。

            function Person(){
            }
            
            Person.prototype.name = "Nicholas";
            Person.prototype.age = 29;
            Person.prototype.job = "Software Engineer";
            Person.prototype.sayName = function(){
                alert(this.name);
            };
            
            var person1 = new Person();
            person1.sayName();   //"Nicholas"
            
            var person2 = new Person();
            person2.sayName();   //"Nicholas"
          
            alert(person1.sayName == person2.sayName);  //true
            
            alert(Person.prototype.isPrototypeOf(person1));  //true
            alert(Person.prototype.isPrototypeOf(person2));  //true
            
            //only works if Object.getPrototypeOf() is available
            if (Object.getPrototypeOf){
                alert(Object.getPrototypeOf(person1) == Person.prototype);  //true
                alert(Object.getPrototypeOf(person1).name);  //"Nicholas"
            }
    alert(Person.prototype.constructor == Person); //true

    in操作符:当对象能够访问给定的属性时,返回true,不论改属性在实例还是原型中。hasOwnProperty()只针对对象实例。自定义hasPrototypeProperty()监测原型对象中的属性。

            function hasPrototypeProperty(object, name){
                return !object.hasOwnProperty(name) && (name in object);
            }

     不是所有的属性都是可枚举的 ECMAScript5中constructor和prototype都是不可枚举的。Object.keys()可以取得对象的上所有可枚举的属性。

            function Person() {
            }
    
            Person.prototype.name = "Nicholas";
            Person.prototype.age = 29;
            Person.prototype.job = "Software Engineer";
            Person.prototype.sayName = function () {
                alert(this.name);
            };
    
            var keys = Object.keys(Person.prototype);
            alert(keys);   //"name,age,job,sayName"
    
            //返回所有属性
            var k0 = Object.getOwnPropertyNames(Person.prototype);
            alert(k0);   //"constructor,name,age,job,sayName"
    
            var person1 = new Person();
            person1.name = "yuansong";
            person1.age = 28;
    
            var k1 = Object.keys(person1);
            alert(k1);//"name,age"

    原型的动态性
    尽管我们可以随时的为原型添加属性和方法,并且修改能够立即在所有对象实例中反应出来,但是重写整个原型对象就不一样了。

            function Person(){
            }
            
            var friend = new Person();
                    
            Person.prototype = {
                constructor: Person,
                name : "Nicholas",
                age : 29,
                job : "Software Engineer",
                sayName : function () {
                    alert(this.name);
                }
            };
            
            friend.sayName();   //error


    原型对象的问题

    原型对象中的所有属性是被很多实例共享的,这对于包含原始类型值的属性没有影响,但对于包含引用类型值得属性来说,比较问题就严重了。。。

            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
  • 相关阅读:
    软件工程课感想
    冲刺阶段(二)第五天 5月19日
    CATransition转场动画
    UIView与CALayer的区别
    CALayer的基本属性
    CALayer的基本属性和contexts的内容 即添加图片
    Quartz2D-master手动截图
    CoreAnimation-06-CAKeyframeAnimation 相关代码
    CoreAnimation-06-CAKeyframeAnimation
    视频播放
  • 原文地址:https://www.cnblogs.com/YuanSong/p/3898119.html
Copyright © 2020-2023  润新知