Javascript面向对象编程一直是面试中的重点,将本身的理解整理以下,主要参考《Javascript高级程序设计 第三版》,欢迎批评指正。javascript
var person_1 = { name: "userName", age: 20 }
经过一个构造函数接收参数的方式构造对象,可无数次调用这个函数,经过改变参数构造不一样的对象
function createPerson(name,age){ var o = new Object();//建立一个空的对象 -- 原料 o.name = name; o.age = age; o.sayName = function(){ //给对象属性赋值 -- 加工过程 alert(this.name) } return o; //返回加工后的对象 -- 出厂 } var leo = createPerson('Leo',30); leo.sayName(); //"Leo" var cherry = createPerson('Cherry',20); cherry.sayName(); //"Cherry"
缺点:工厂模式建立的对象,没法判断其类型
相似Array,Object这种原生的构造函数,咱们能够经过建立自定义的构造函数,从而定义自定义对象的类型和方法
function Person(name,age){ this.name = name; this.age = age; this.sayName = function(){ alert(this.name); } } var leo = new Person('Leo',18); var cherry = new Person('Cherry',25); leo.sayName(); cherry.sayName();
alert(leo instanceof Person); //true alert(leo instanceof Object); //true 全部对象都继承自Object
Person('window',100);//直接调用,至关于将Person类的属性方法直接添加到了this上 window.sayName(); //window
this.sayName = new Function("alert(this.name)")
单首创建出来的alert(leo.sayName==cherry.sayName);//false
function Person(){} //构造函数变成空 Person.prototype.name = 'Leo'; Person.prototype.age =30; Person.prototype.sayName = function(){ alert(this.name); } var person1 = new Person(); var person2 = new Person(); alert(person1.sayName==person2.sayName);//true 将sayName方法定义在Person的prototype属性中,可由多个不一样的实例共享 //简化写法: function Person() { } //构造函数变成空 Person.prototype = { name: 'Leo', age: 30, sayName: function () { alert(this.name); } } var person1 = new Person(); var person2 = new Person();
alert(Person.prototype.isPrototypeOf(person1));//true alert(Person.prototype.isPrototypeOf(person2));//true alert(Object.getPrototypeOf(person1)==Object.getPrototypeOf(person2));//true
person1.name='Nancy'; alert(person1.name);//Nancy alert(person1.hasOwnProperty("name"));//True 实例对象上的属性 alert(person2.hasOwnProperty("name"));//false 原型中的属性 alert("name" in person1);//true alert("name" in person2);//true for(key in person1){ alert(`${key}:${person1[key]}`) }
function Newperson(){ } Newperson.prototype = { constructor : Newperson, name:"Tony", age:30, job:"Developer", friends:['Leo','Cherry'], sayName:function(){ alert(this.name); } } let newPerson1 = new Newperson(); let newPerson2 = new Newperson(); alert(newPerson1.friends);//Leo, Cherry alert(newPerson2.friends);//Leo, Cherry newPerson1.friends.push('Mai');//friends属性引用数组在Newperson.prototype而非newPerson1中,newPerson1.friends和newPerson2.friends指向的是同一个引用 alert(newPerson1.friends);//Leo, Cherry, Mai alert(newPerson2.friends);//Leo, Cherry, Mai alert(newPerson1.friends === newPerson2.friends);//true
function Person(name,age,job){ this.name = name; this.age = age; this.job = job; this.friends = ["Leo","Cherry"]; } Person.prototype = { constructor:Person, sayName:function(){ alert(`${this.name} is a ${this.job}.`);//公共方法 } } let person1 = new Person('Mai',18,'actor'); let person2 = new Person('Bob',25,'developer'); person1.sayName(); person2.sayName(); alert(person1.friends == person2.friends);//false friends属性在构造函数中定义,不在原型中,两个实例不会相互影响 person1.friends.push('Tony'); person2.friends.push('Melody'); alert(person1.friends);//Leo, Cherry, Tony alert(person2.friends);//Leo, Cherry, Melody