1 Js面向对象复习
blobt edited this page 4 years ago
/**
 * 第一阶段
 * 基础方法创建一个对象
 */
var person = new Object();

person.name = 'Nemo';
person.age = 38;

person.introduce = function () {
    console.log("My name is " + this.name + ", my age is " + this.age);
}

person.introduce();


/**
 * 第二阶段
 * 使用工厂方法创建对象
 * 问题:
 * 没有new
 * 每个对象的方法和属性都独立,浪费资源
 * @param string name 
 * @param integral age 
 */
function createPerson(name, age) {

    var person = new Object();

    person.name = name;
    person.age = age;

    person.introduce = function () {
        console.log("My name is " + this.name + ", my age is " + this.age);
    }

    return person;
}

var person2 = createPerson("Blobt", 25);
person2.introduce();


/**
 * 第三阶段
 * 使用构造函数创建对象
 * @param string name 
 * @param integral age 
 */
function Person(name, age) {
    this.name = name;
    this.age = age;

    this.introduce = function () {
        console.log("My name is " + this.name + ", my age is " + this.age);
    }
}

var person3 = new Person("sasa", 18);
person3.introduce();


/**
 * 第四阶段理解原型
 * 原型是用来操作类的
 * 用来改变类的方法
 */
var arr1 = new Array(1, 2, 3, 4);
var arr2 = new Array(5, 6, 7, 8);

Array.prototype.sum = function () {
    var ret = 0;
    for (var i = 0; i < this.length; i++) {
        ret += this[i];
    }
    return ret;
}
console.log(arr1.sum());
console.log(arr2.sum());


/**
 * 第五阶段 
 * 使用原型定义方法,改善资源的浪费
 * 这个又叫混合法
 */

function PersonI(name, age) {
    this.name = name;
    this.age = age;
}

PersonI.prototype.introduce = function () {
    console.log("My name is " + this.name + ", my age is " + this.age);
}

var person4 = new PersonI("dola", 38);
person4.introduce();


/**
 * 第六阶段了解this的问题
 */

function PersonI2(name, age) {
    this.name = name;
    this.age = age;


}
/**
 * My name is , my age is undefined
 */
PersonI2.prototype.introduce = function () {
    console.log("My name is " + this.name + ", my age is " + this.age);
}

var person5 = new PersonI2("dodo", 8);
//setInterval(person5.introduce, 1000); 

/**
 * 第七阶段
 * 使用json构建对象
 * 只适合于用一个的对象
 */

var person6 = {
    name: 'jucy',
    age: 10,
    introduce: function () {
        console.log("My name is " + this.name + ", my age is " + this.age);
    },
    common: {//这里定义一个成命名空间
        say: function () {
            console.log("saysaysay")
        },
        do: function () {
            console.log("dododo");
        }
    }
}

person6.introduce();
person6.common.say();


/**
 * 第八阶段
 * 使用call和原型链 赋值实现继承
 * 问题
 * 由于原型链是=操作只是引用复制,不是深拷贝
 * 所以这样的继承会有问题,主要体现在子类对原型的修改会影响父类
 */

function Worker(name, age, work) {
    PersonI.call(this, name, age);
    this.work = work;
}

Worker.prototype = PersonI.prototype;
Worker.prototype.working = function(){
    console.log("My work is "+ this.work);
}

var worker = new Worker("lisa", 24, "phper");
worker.introduce();
worker.working();


/**
 * 第九阶段
 * 理解引用与深拷贝
 * js的所有对象都是引用
 */

 var arr1 = [1,2,3];
 var arr2 = [];

 for(var i =0; i< arr1.length; i++){
     arr1[i] = arr2[i];
 }

 arr2.push(4);

 console.log(arr1);

/**
 * 第十阶段
 * 使用原型链深拷贝,解决原型链赋值的问题
 */
function Worker2(name, age, work) {
    PersonI.call(this, name, age);
    this.work = work;
}

for(var i in PersonI.prototype){
    Worker2.prototype[i] = PersonI.prototype[i];
}

Worker2.prototype.working = function(){
    console.log("My work is "+ this.work);
}

var worker = new Worker2("lilei", 34, "javaer");
worker.introduce();
worker.working();