封装
创建一个类
let Book = function (id, bookname, price) {
this.id = id;
this.bookname = bookname;
this.price = price
};
Book.prototype.dispaly = function () {};
// Book.prototype={
// dispaly:function () {}
// };
let book = new Book(10, 'javascript', 50);
console.log(book.bookname);
属性与方法封装
let Book=function (id,name,price) {
let num=1;
function checkId() {}
this.getName=function () {};
this.getPrice=function () {};
this.setName=function () {};
this.setPrice=function () {};
this.id=id;
this.copy=function () {};
this.setName(name);
this.setPrice(price);
};
Book.isChinese = true;
Book.resetTime = function () {
console.log('new Time');
};
Book.prototype = {
isJSBook:false,
display:function () {}
};
let b=new Book(11,'javascript',50);
console.log(b.num);
console.log(b.isJSBook);
console.log(b.id);
console.log(b.isChinese);
console.log(Book.isChinese);
Book.resetTime();
闭包实现
let Book=(function () {
let bookNum=0;
function checkBook(name) {}
return function (newId,newName,newPrice) {
let name,price;
function checkId(id) {}
this.getName=function () {};
this.getPrice=function () {};
this.setName=function () {};
this.setPrice=function () {};
this.id=newId;
this.copy=function(){};
bookNum++;
if (bookNum>100)
throw new Error('only 100');
this.setName(name);
this.setPrice(price);
}
})();
Book.prototype={
isJSBook:false,
display:function(){},
};
将添加原型属性和方法部分整合到闭包内
let Book=(function () {
let bookNum=0;
function checkBook(name) {}
function _book(newId,newName,newPrice) {
let name,price;
function checkId(id) {}
this.getName=function () {};
this.getPrice=function () {};
this.setName=function () {};
this.setPrice=function () {};
this.id=newId;
this.copy=function(){};
bookNum++;
if (bookNum>100)
throw new Error('only 100');
this.setName(name);
this.setPrice(price);
}
_book.prototype={
isJSBook:false,
display:function(){},
};
return _book;
})();
忘记new
let Book = function (title,time,type) {
this.title=title;
this.time=time;
this.type=type;
};
let book=Book('javascript','2014','js');
console.log(book);
console.log(window.title)
console.log(window.time)
console.log(window.type)
无须new的实现
let Book = function (title,time,type) {
if (this instanceof Book){
this.title=title;
this.time=time;
this.type=type;
}else {
return new Book(title,time,type)
}
};
let book=Book('javascript','2014','js');
console.log(book);
console.log(book.title);
console.log(book.time);
console.log(book.type);
console.log(window.title);
console.log(window.time);
console.log(window.type);
继承
子类的原型对象----类式继承
function SuperClass() {
this.superValue=true;
}
SuperClass.prototype.getSuperValue=function () {
return this.superValue;
};
function SubClass() {
this.subValue=false;
}
SubClass.prototype=new SuperClass();
SubClass.prototype.getSubValue=function () {
return this.subValue;
};
let instance=new SubClass();
console.log(instance.getSuperValue());
console.log(instance.getSubValue());
console.log(instance instanceof SuperClass);
console.log(instance instanceof SubClass);
console.log(SubClass instanceof SuperClass);
console.log(SubClass.prototype instanceof SuperClass);
console.log(instance instanceof Object);
缺点:引用属性会被共用,且无法传递参数
function SuperClass() {
this.books=['javascript','html','css'];
}
function SubClass() {}
SubClass.prototype = new SuperClass();
let instance1=new SubClass();
let instance2=new SubClass();
console.log(instance2.books);
instance1.books.push('design');
console.log(instance2.books);
创建即继承----构造函数继承(但无法继承父类原型中的方法)
function SuperClass(id) {
this.books=['javascript','html','css'];
this.id=id;
}
SuperClass.prototype.showBooks=function () {
console.log(this.books);
};
function SubClass(id) {
SuperClass.call(this,id);
}
let instance1=new SubClass(10);
let instance2=new SubClass(11);
instance1.books.push('design');
console.log(instance1.books);
console.log(instance1.id);
console.log(instance2.books);
console.log(instance2.id);
instance1.showBooks();
组合继承
function SuperClass(name) {
this.name=name;
this.books=['html','css','javascript'];
}
SuperClass.prototype.getName=function () {
console.log(this.name);
};
function SubClass(name,time) {
SuperClass.call(this,name);
this.time=time;
}
SubClass.prototype=new SuperClass();
SubClass.prototype.getTime=function () {
console.log(this.time);
};
let instance1=new SubClass('js book',2014);
instance1.books.push('desgin');
console.log(instance1.books);
instance1.getName();
instance1.getTime();
let instance2=new SubClass('css book',2013);
console.log(instance2.books);
instance2.getName();
instance2.getTime();
原型式继承
function inheritObject(o) {
function F() {}
F.prototype=o;
return new F();
}
let book={
name:'js book',
alikeBook:['css book','html book']
};
let newBook=inheritObject(book);
newBook.name = 'ajax book';
newBook.alikeBook.push('xml book');
let otherBook=inheritObject(book);
otherBook.name='flash book';
otherBook.alikeBook.push('as book');
console.log(newBook.name);
console.log(newBook.alikeBook);
console.log(otherBook.name);
console.log(otherBook.alikeBook);
console.log(book.name);
console.log(book.alikeBook);
寄生式继承
function inheritObject(o) {
function F() {}
F.prototype=o;
return new F();
}
let book={
name:"js book",
alikeBook:['css book','html']
};
function createBook(obj) {
let o=new inheritObject(obj);
o.getName=function () {
console.log(name);
};
return o;
}
寄生组合式继承
function inheritObject(o) {
function F() {}
F.prototype=o;
return new F();
}
function inhertPrototype(subClass,superClass) {
let p=inheritObject(superClass.prototype);
p.constructor = subClass;
subClass.prototype=p;
}
function SuperClass(name) {
this.name=name;
this.colors=['red','blue','green'];
}
SuperClass.prototype.getName=function () {
console.log(this.name);
};
function SubClass(name,time) {
SuperClass.call(this,name);
this.time=time;
}
inhertPrototype(SubClass,SuperClass);
SubClass.prototype.getTime=function () {
console.log(this.time);
};
let instance1=new SubClass('js book',2014);
let instance2=new SubClass('css book',2013);
instance1.colors.push('black');
console.log(instance1.colors);
console.log(instance2.colors);
instance2.getName();
instance2.getTime();
多继承
单个对象属性复制
let extend = function (target, source) {
for (let property in source){
target[property]=source[property];
}
return target;
};
let book={
name:'js',
alike:['css','html','javascript']
};
let anotherBook={
color:'blue'
};
extend(anotherBook,book);
console.log(anotherBook.name);
console.log(anotherBook.alike);
anotherBook.alike.push('ajax');
anotherBook.name='desgin';
console.log(anotherBook.name);
console.log(anotherBook.alike);
console.log(book.name);
console.log(book.alike);
多对象属性复制
let mix=function () {
let i=1,
len=arguments.length,
target=arguments[0],
arg;
for (;i<len;i++){
arg=arguments[i];
for (let property in arg){
target[property]=arg[property];
}
}
return target;
};
绑定到原生Object
Object.prototype.mix=function () {
let i=0,
len=arguments.length,
arg;
for (;i<len;i++){
arg=arguments[i];
for (let property in arg){
this[property]=arg[property];
}
}
};
otherBook={};
book1={
name:'book1'
};
book2={
color:'red'
};
otherBook.mix(book1,book2);
console.log(otherBook);
多态
function add() {
let arg=arguments,
len=arg.length;
switch (len){
case 0:
return 10;
case 1:
return 10+arg[0];
case 2:
return arg[0]+arg[1];
}
}
console.log(add());
console.log(add(5));
console.log(add(6,7));
封装到类中
function Add() {
function zero() {
return 10;
}
function one(num) {
return 10+num;
}
function two(num1,num2) {
return num1+num2;
}
this.add=function () {
let arg=arguments,
len=arg.length;
switch (len){
case 0:
return zero();
case 1:
return one(arg[0]);
case 2:
return two(arg[0],arg[1]);
}
}
}
let A=new Add();
console.log(A.add());
console.log(A.add(5));
console.log(A.add(6,7));