JavaScript面向对象

一个简单的对象：

var person = {
    name: 'TOM',
    age: '20',
    getName: function() {
        return this.name
    }
}

访问person.name或者person[‘name’],处理复杂数据如下：

['name','person'].foreach(function(item){
    console.log(person[item]);
})

JavaScript的工厂模式

var createPerson = function(name, age) {
    var o = new Object();
    o.name = name;
    o.age = age;
    o.getName = function() {
        return this.name;
    }
    return o;
}
var perTom = createPerson('TOM', 20);
var PerJake = createPerson('Jake', 22);

关于构造函数的new

• 与普通函数相同，只是规定首字母大写
• 使用new执行了如下过程：

1. 声明一个中间对象；
2. 将中间对象的原型指向构造函数的原型；
3. 将构造函数的this指向中间对象；
4. 返回该中间对象，即返回示例对象。

原型

使用构造函数解决判断对象与实例关系的问题：
var p1=New (person,’tom’,20); 等效于 var p1=new Person(‘tom’,20);
每一个构造函数都有一个prototype属性，该属性指向一个对象，该对象就是原型。
构造函数的prototype以及所有实例对象的_proto_属性都指向原型对象，而原型对象的constructor属性指向构造函数
构造函数内部属性和方法–>私有方法
原型对象内部属性和方法–>共有方法
访问实例对象的属性和方法，优先访问实例对象内部的属性和方法。
几乎所有对象即可能是构造函数，也可能是实例对象，而且还可以同时是实例对象和构造函数。
原型链：实例对象A是构造函数B的实例，同时这个构造函数B是构造函数C的实例，构造函数B同时也是实例对象B的proto属性指向原型对象A，而原型的constructor属性指向构造函数C。

继承

构造函数的继承：通过call和apply实现继承

function Person(name, age) {
    this.name = name;
    this.age = age;
}
Person.prototype.getName = function() {
    return this.name;
}
function cPerson(name, age, job) {
    Person.call(this, name, age);
    this.job = job;
} 
// 继承原型
cPerson.prototype = new Person(name, age);
// 添加更多方法
cPerson.prototype.getLive = function() {}

使用ES5的create函数：

function Person(name, age) {
    this.name = name;
    this.age = age;
}
Person.prototype.getName = function() {
    return this.name
}
Person.prototype.getAge = function() {
    return this.age;
}
function Student(name, age, grade) {
    // 构造函数继承
    Person.call(this, name, age);
    this.grade = grade;
}
// 原型继承
Student.prototype = Object.create(Person.prototype, {
    // 不要忘了重新指定构造函数
    constructor: {
        value: Student
    }
    getGrade: {
        value: function() {
            return this.grade
        }
    }
})
var s1 = new Student('ming', 22, 5);
console.log(s1.getName());  // ming
console.log(s1.getAge());   // 22
console.log(s1.getGrade()); // 5

如有错误，烦请指正，谢谢！

赏

谢谢！

支付宝

微信