面向对象详解

创建对象各种方法：

//1.原始模式,对象字面量方式
var person = {
    name: 'Jack',
    age: 18,
    sayName: function () { alert(this.name); }
};
//原始模式；object构造函数方式；
var person = new Object();
person.name = 'Jack';
person.age = 18;
person.sayName = function () {
    alert(this.name);
};
//2.工厂模式，定义一个函数创建对象

function creatPerson (name, age) {
    var temp = new Object();
    temp.name = name;
    temp.age = age;
    temp.sayName = function () {
        alert(this.name);
    };
    return temp;
}
//3.构造函数模式，为对象定义一个构造函数
function Person (name, age) {
    this.name = name;
    this.age = age;
    this.sayName = function () {
        alert(this.name);
    };   
}
var p1 = new Person('Jack', 18); //创建一个p1对象
Person('Jack', 18);    
//属性方法都给window对象，window.name='Jack'，
//window.sayName()会输出Jack

//4.原型模式，直接定义prototype属性
//与3添加对象的区别。
function Person () {}
Person.prototype.name = 'Jack';/Person.prototype.age = 18;
Person.prototype.sayName = function () { alert(this.name); };

//4.原型模式，字面量定义方式
function Person () {}
Person.prototype = {
    name: 'Jack',
    age: 18,
    sayName: function () { alert(this.name); }
};

var p1 = new Person(); //name='Jack'
var p2 = new Person(); //name='Jack

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

Person.prototype = {
    hobby: ['running','football'];
    sayName: function () { alert(this.name); },
    sayAge: function () { alert(this.age); }
};

var p1 = new Person('Jack', 20);
//p1:'Jack',20; __proto__: ['running','football'],sayName,sayAge

var p2 = new Person('Mark', 18);
//p1:'Mark',18;__proto__: ['running','football'],sayName,sayAge

js封装

JS封装只有两种状态，一种是公开的，一种是私有的。

function Person(name,sal){
    this.name=name;         //公开
    var sal=sal;                 //私有
    this.showInfo=function(){ //公开
        window.alert(this.name+" "+sal);
    }
    function showInfo2(){      //把函数私有化
        window.alert("你好"+this.name+" "+sal);
    }
}
var p1 = new Person('Cece', 20, 10000); 
window.alert(p1.name + " is " +p1.age); //Cece is undefined
p1.showInfo();//Cece 20
p1.showInfo2();//VM302:1 Uncaught TypeError: p1.showInfo2 is not a function(…)

构造函数方式与原型方式给对象添加方法的区别:

//1.通过构造函数方式给对象添加方法
function Dog(name){
    this.name=name;
    this.shout=function(){
        window.alert("小狗尖叫"+this.name);
    }
}
var dog1=new Dog("aa");
var dog2=new Dog("bb");
if(dog1.shout==dog2.shout){
    window.alert("相等");
}else{
    window.alert("不相等");
}

//会输出“不相等”

//2.通过原型方式给对象添加方法
function Dog(name){
    this.name=name;    
}
Dog.prototype.shout=function(){
    window.alert("小狗尖叫"+this.name);
}
var dog1=new Dog("aa");
var dog2=new Dog("bb");
if(dog1.shout==dog2.shout){
    window.alert("相等");
}else{
    window.alert("不相等");
}

//会输出“相等”