资讯专栏INFORMATION COLUMN

20170607-面向对象01-创建对象

NusterCache / 550人阅读

摘要:原型对象的问题省略了为构造函数传递参数,导致了所有实例在默认情况下都取得相同的属性值。即使有其他代码会给这个对象添加方法或数据成员,但也不可能有别的方法访问传入到构造函数中的原始数据。

创建对象 1.Object构造函数

创建一个Object的实例,然为其添加属性和方法(早期创建对象的模式)

var person = new Object();
person.name = "Nicholas";
person.age = 29;
person.job = "Software Engineer";

person.sayName = function(){
    alert(this.name);

}
2.对象字面量
var person = {
    name: "Nicholas";
    age: 29;
    job: "Software Engineer";
    
    sayName: function(){
        alert(this.name);
    }
}

前面提到了早期创建对象的两种方法:Object构造函数对象字面量,但是这些方式有明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码。

3.工厂模式:
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 = create("Nicholas", 29, "Software Engineer");

缺点:

工厂模式虽然解决了创建多个相似对象会有大量重复代码的问题,但是却没有解决 对象识别 的问题(因为返回的都是Object类型)

4.构造函数模式

ECMAScript中的构造函数可以用来创建特定类型的对象。

function Person(name, age, job){
    this.name=name;
    this.age=age;
    this.job=job;
    this.sayName=function(){
        alert(this.name);
    }
}
// 注意将Person当做构造函数,需要使用new操作符来创建新对象
var person1 = new Person("xin",22,"Software Engineer");
var person2 = new Person("wu",22,"Software Engineer");

在上面的例子中,person1和person2分别保存着一个不同的实例,但是这两个对象都有一个constructor(构造函数)属性,该属性执行Person。

检测对象类型:

利用constructor属性:

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

利用instanceof操作符:

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

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

缺点:

每个方法都要在每个实例上重新创建一遍(针对每个实例都会创建一组同样新方法)。上例中,person1和person2中都有一个sayName的方法,但是两个实例中的方法不是同一个Function的实例。因此不同实例上的同名函数是不相等的

解决方法:把函数定义转移到构造函数外部。

function Person(name, age, job){
    this.name=name;
    this.age=age;
    this.job=job;
    this.sayName=sayName;//sayName属性设置为全局的sayName函数
}
function sayName(){
        alert(this.name);
}
var person1 = new Person("xin",22,"Software Engineer");
var person2 = new Person("wu",22,"Software Engineer");

修改后,person1和person2对象共享了在全局作用域中定义的同一个sayName()函数。但是出现了新的问题:

在全局作用域中定义的函数(sayName)实际上只能被某个对象(person1 person2)调用,让全局作用域“名不副实”;

如果对象需要定义很多方法,则需要在全局作用域中定义很多全局函数,是得这个 自定义的引用类型(自定义的构造函数) 无封装性可言。

解决方法:原型模式

5.原型模式

每个函数都有一个prototype(原型) 属性,这个属性是一个指针,指向一个对象,而这个对象的用途是 包含可以由特定类型的所有实例共享的属性和方法

function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.ptototype.sayName = function(){
    alert(this.name);
}
var person1 = new Person();
person1.sayName(); //"Nicholas"

var person2 = new Person();
person2.sayName();//"Nicholas"
//person1和person2的属性和方法是所有实例共享的
alert(person1.sayName == person2.sayName); //true

理解原型对象

原型属性[[Prototype]]的访问

确定对象之间的关系 isPrototypeOf

alert(Person.prototype.isPrototypeOf(person1));//true

获取原型对象 Object.getPrototypeOf()

alert(Object.getPrototypeOf(person1) == Person.prototype); //true
alert(Object.getPrototypeOf(person1).name);//Nicholas

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

虽然可以通过对象实例访问保存在原型中的值,但却不能通过对象重写原型中的值。如果在实例中添加了一个属性,且该属性与实例原型中的一个属性同名,则该属性会屏蔽原型中的那个属性。

可以使用hasOwnProperty()方法来检测一个属性是存在与实例中,还是存在与原型中。

`
person1.hasOwnProperty("name"); //false
`

原型与in操作符:多带带使用in操作符时,in操作符会在通过原型能够访问给定属性时返回true,无论该属性存在与实例中还是存在原型中。同时使用hasOwnProperty()方法和in操作符,就可以确定该属性到底是存在与对象中,还是存在与原型中

alert( !person1.hasOwnProperty(name) && name in person1); //true

更简单的原型语法:

前面的例子中每添加一个属性和方法就要敲一遍Person.prototype。为了减少不必要的输入,更常见的方法是 用一个包含所有属性和方法的对象字面量来重写整个原型对象

function Person(){
}
Person.prototype = {
    name: "Nicholas",
    age: 29,
    job: "Software Engineer",
    sayName: function(){
        alert(this.name);
    }
}

注意
这里使用的语法,本质上完全重写了默认的prototype对象,因此constructor属性也就变成了新对象的constructor属性(指向Object构造函数),不再指向Person函数。使用instanceof操作符还能返回正确的结果,但是通过constructor已经无法确定对象的类型了。

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

如果constructor属性很重要,可以将其设为适当的值

//方法一,但是会使constructor属性的[[Enumerable]]特性变为true
function Person(){
}
Person.prototype = {
    constructor:Person,
    name:"Nicholas",
    age:29,
    job:"Software Engineer",
    sayName:function(){
        alert(this.name);
    }
}
function Person(){
}
Person.prototype = {
    name:"Nicholas",
    job:"Software Engineer",
    age:29,
    sayName:function(){
        alert(this.name);
    }
}
Object.defindProperty(Person.prototype, "constructor",{ 
    enumerable: false,
    value: Person
});

原生对象的原型:

所有原生类型(Object,Array,String,等等)都在其构造函数的原型上定义了方法。

原型对象的问题:

省略了为构造函数传递参数,导致了所有实例在默认情况下都取得相同的属性值。

原型对象的最大问题是由其共享属性 的本质所导致的:

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

person1.friends.push("van");
alert(person1.friends); //sheldon,court,van
alert(person2.friends); //sheldon,court,van
alert(person1.friends === person2.friends);//true

出现上述问题的原因在于:person1和person2的friends属性共享一个数组。

6.组合使用构造函数模式和原型模式

构造函数模式用来定义实例属性,原型模式用来定义方法和共享属性。结果每个实例都会有自己的一份实例属性的副本,但同时又共享着对方法的引用,最大限度的节省了内存。

function Person(name,age,job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.friends = ["sheldon","mary"];
}
Person.prototype = {
    constructor: Person,
    sayName: function(){
        alert(this.name);
    }
}
7.动态原型模式

结合使用构造函数模式和原型模式是使用最为广泛的创建自定义类型的方法,但是却将属性和方法分别定义(独立的构造函数和原型),使用动态原型模式可以解决这个问题,将所有信息都封装在构造函数中,通过在构造函数中初始化原型、保持使用构造函数和原型的优点。

function Person(name, age, job){
    this.name = name
    this.age = age
    this.job = job
    
    // 这段代码只会在初次调用构造函数时才会执行
    if(typeof this.sayName === "function"){
        Person.prototype.sayName = function(){
            alert(this.name)
        }
    }
}

var friend = new Person("xin", 29, "Softwar Engineer")
friend.sayName()
8.稳妥构造函数模式

特点:1.新创建对象的实例方法不引用this;2.不使用new 操作符调用构造函数

function Person(name,age,job){
    var o = new Object();
    o.sayName = function(){
        alert(name);
    }
    return o;
}

以这种方式创建的对象中,除了使用sayName()方法之外,没有其他办法访问name的值。

var friend = Person("Nicholas",29,"Software Engineer");
friend.sayName();

即使有其他代码会给这个对象添加方法或数据成员,但也不可能有别的方法访问传入到构造函数中的原始数据(name,job,age)。稳妥构造函数模式提供的这种安全性,使得它非常适合在某些安全环境中执行。

使用稳妥构造函数模式创建的对象与构造函数之间没什么关系,因此instanceof操作符对这种对象没有什么意义

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/83390.html

相关文章

  • 20170607-面向对象03-判断对象类型的方法

    摘要:这种方法也存在这样的问题如果修改了构造函数的原型对象,之前创建的对象无法通过这种方式来确定类型修改构造函数的原型对象会导致之前创建的对象无法通过这种方式判断类型判断对象继承自哪些父类型使用使用 判断对象类型的方法 使用原型对象上的constructor属性来判断 每个对象的原型上都有一个constructor属性,指向了其构造函数 注意:对象没有constructor属性(除非自己添加...

    zhoutao 评论0 收藏0
  • 20170607-面向对象02-继承

    摘要:继承原型链原型链是实现继承的主要方法。临时的构造函数将传入的对象作为这个构造函数的原型返回新实例以为原型创建一个新实例不仅属于所有,而且也会被共享。上诉例子只调用了一次构造函数,因此避免了在上面创建不必要的多余的属性。 继承 1 原型链 原型链是实现继承的主要方法。其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。 构造函数、原型和实例的关系 每个构造函数都有一个原型对...

    lushan 评论0 收藏0
  • 20170607-私有变量

    摘要:私有变量任何在函数中定义的变量,都可以认为是私有变量,因为在不能再函数的外部访问这些变量。我们把有权访问私有变量和私有函数的公有方法称为特权方法。模块模式模块模式是为单例创建私有变量和特权方法。 私有变量 任何在函数中定义的变量,都可以认为是私有变量,因为在不能再函数的外部访问这些变量。私有变量包括函数的参数、函数中定义的变量和函数。我们把有权访问私有变量和私有函数的公有方法称为特权方...

    trilever 评论0 收藏0
  • mybatis 入门搭建

    摘要:首先导包依赖如下构建应用是以为中心的实例可以通过获得其中是工厂接口任务用于创建配置文件将会解析配置文件在类对象中配置获取数据源事务管理器映射器在文件下新建文件配置文件内容如下定义别名定义数据库信息事物管理 首先导包 依赖如下 mysql mysql-connector-java 8.0.15 org.m...

    enali 评论0 收藏0
  • JavaScript设计模式与开发实践 | 01 - 面向对象的JavaScript

    摘要:在中,并没有对抽象类和接口的支持。例如,当对象需要对象的能力时,可以有选择地把对象的构造器的原型指向对象,从而达到继承的效果。本节内容为设计模式与开发实践第一章笔记。 动态类型语言 编程语言按数据类型大体可以分为两类:静态类型语言与动态类型语言。 静态类型语言在编译时已确定变量类型,动态类型语言的变量类型要到程序运行时,待变量被赋值后,才具有某种类型。 而JavaScript是一门典型...

    suxier 评论0 收藏0

发表评论

0条评论

NusterCache

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<