面向对象

 

目录

 

创建对象的⽅法

⽅法1:⼯⼚模式(没有对象识别)

⽅法2:构造函数模式

⽅法3:原型模式

⽅法4:组合模式

es6的写法

面试题


创建对象的⽅法

⽅法1:⼯⼚模式(没有对象识别)

function body() {
    var o = new Object();
    o._bloodVolume = 100;
    o._attackVolume = 500;
    return o;
}
var monster = body();
var monster2 = body();

 

⽅法2:构造函数模式

同一个构造函数的多个实例之间,无法共享属性,从而造成对系统资源的浪费。

使⽤new操作符,来创建新的对象。该function不显式的创造对象。

new的⼏个步骤:

1、创建⼀个新对象

2、将构造函数中的作⽤域指向该对象

3、执⾏构造函数中的代码

4、返回新对象

function Body() {
    this._bloodVolume = 100;
    this._attackVolume = 500;
}
var monster = new Body();

        ⼿写⼀个【new函数】

function Body() {
    this._bloodVolume = 100;
    this._attackVolume = 500;
}
function newOperation(constructFunc) {
    const newObj = Object.create(null);
    // call()方法会将改变this的指向,同时会执行代码
    constructFunc.call(newObj);
    return newObj;
}
var monster = newOperation(Body);

 

⽅法3:原型模式

 

原型对象的属性不是实例对象自身的属性。只要修改原型对象,变动就立刻会体现在所有实例对象上。

我们创建的每个函数都有个prototype属性,这个属性是个指针,指向⼀个对象,⽽这个对象的⽤途是

包含可以由特定类型的所有实例共享的属性和⽅法。那么prototype就是通过调⽤构造函数⽽创建的那

个对象实例的原型对象,

 

function Body() {}
Body.prototype._bloodVolume = 100;
Body.prototype._attackVolume = 500;
var monster = new Body();

什么是原型?

    1. 真正的原型,在构造函数中

    2. 我们每声明⼀个函数,浏览器就会在内存中创建⼀个对象,在这个对象中增加⼀个属性,叫constructor指向我们的函数,并把我们的函数的prototype属性指向这个对象。

    3. ⽤这个构造函数创建的对象都有⼀个不可访问的属性 [[prototype]] ,这个属性就指向了构造函数的prototype,在浏览器中,⽀持使⽤ __proto__ 来访问这个对象使⽤原型对象的好处是,可以在创建出来的多个对象中,共享属性和⽅法。

 

⼿写⼀个【new函数】

 

function Body() {}
Body.prototype._bloodVolume = 100;
Body.prototype._attackVolume = 500;
function newOperation(constructFunc) {
    const newObj = Object.create(constructFunc.prototype);
    return newObj;
}
var monster = newOperation(Body);

这种模式下,每⼀个⽣成的对象都有⼀个属性[[Prototype]],浏览器⼚商在具体实现的时候,保留了⼀

个 __proto__ 属性,⽤以让我们访问[[Prototype]]

 

[Prototype]的ECMA解释

19.2.4.3 prototype Function instances that can be used as a constructor have a prototype
property. Whenever such a Function instance is created another ordinary object is also created
and is the initial value of the function's prototype property. Unless otherwise specified, the value
of the prototype property is used to initialize the [[Prototype]] internal slot of the object created
when that function is invoked as a constructor.

⽅法4:组合模式

组合模式是构造函数和原型模式⼀起使⽤,构造函数模式⽤于定义实例属性,原型模式⽤于定义⽅法

和共享的属性。

function Person() {
    this._attackVolume = 100;
}
Person.prototype = {
    attack(body) {
        body.bloodVolume -= this.attackVolume - body.defenseVolume;
    }
};
var hero = new Person();

⼿写⼀个【new函数】

function Person() {
    this._attackVolume = 100;
}
Person.prototype = {
    attack(body) {
        body.bloodVolume -= this.attackVolume - body.defenseVolume;
    }
};
function newOperation(constructFunc) {
    const newObj = Object.create(constructFunc.prototype);
    constructFunc.call(newObj);
    return newObj;
}
var hero = newOperation(Person);

 

es6的写法

 

// class expression
var Person = class {
    constructor(height, width) {}
}
// class declaration
class Person {
    constructor(height, width) {}
}

 

面试题

1

function Person() {
    this.name = 1;
    return {};
}
var person = new Person();
console.log('name:', person.name);

2

function Person() {
    this.name = 1;
}
Person.prototype = {
    show: function () {
        console.log('name is:', this.name);
    }
};
var person = new Person();
person.show();

3.

function Person() {
    this.name = 1;
}
Person.prototype = {
    name: 2,
    show: function () {
        console.log('name is:', this.name);
    }
};
var person = new Person();
Person.prototype.show = function () {
    console.log('new show');
};
person.show();

4.

function Person() {
    this.name = 1;
}
Person.prototype = {
    name: 2,
    show: function () {
        console.log('name is:', this.name);
    }
};
var person = new Person();
var person2 = new Person();
person.show = function () {
    console.log('new show');
};
person2.show();
person.show();

5。

function Person() {
    this.name = 1;
}
Person.prototype = {
    name: 2,
    show: function () {
        console.log('name is:', this.name);
    }
};
Person.prototype.show();
(new Person()).show();

 

 

 

 

 

 

你可能感兴趣的:(JavaScript)