function fun(){
this.key = value;
}
fun.prototype.btn = function(){}
var obj = {} //定义一个新对象
`obj.__proto__` = fun.prototype //函数的原型对象赋到obj的原型链上
fun.call(obj) //改变this指向到obj
var ol = obj //返回新对象
面向过程
需要关注每一步
面向对象编程(oop)
以对象的方式实现某个功能
优点:不需要关注如何实现,只关注如何使用
//案例1
<body>
<div id="box"></div>
</body>
<script type="text/javascript">
function Box(){
this.div=document.createElement('div')
}
Box.prototype={
innerText:function(texts){
this.div.innerText=texts
return this
},
innerCss:function(obj){
for (var key in obj){
this.div.style[key]=obj[key]
}
return this
},
innerHtml:function(id){
var d = document.getElementById(id)
d.appendChild(this.div)
return this
}
}
var ass = new Box()
ass.innerText('aaa').innerCss({'background':'red'}).innerHtml('box')
</script>
面向对象
//特性:封装、继承、多态
原型链继承
//子类.prototype = new 父类
//优点:继承父类所有的方法和属性
//缺点:无法给父类构造函数传参
//父类
function Fu(value){
this.keys = value
}
Fu.prototype.fun=function(a){console.log(a)}
//子类
function Zi(){}
Zi.prototype=new Fu('value')
//实例化Zi()
var zi = new Zi()
console.log(zi)
构造函数继承
//子类构造函数中 {父类.call(this)}
//优点:可以给父类构造函数传参
//缺点:不能继承父类的原型
//父类
function Fu(value1,value2){
this.keys1 = value1,
this.keys2 = value2
}
Fu.prototype.fun=function(a){console.log(a)}
//子类
function Zi(){Fu.call(this)}
//实例化Zi()
var zi = new Zi()
console.log(zi)
组合继承
//优点:即可给父类传参,也可继承父类的原型
//父类
function Fu(value1,value2){
this.keys1 = value1,
this.keys2 = value2
}
Fu.prototype.fun=function(a){console.log(a)}
//子类
function Zi(n,m){Fu.call(this,n,m)}
Zi.prototype=new Fu('value1','value2')
//实例化Zi()
var zi = new Zi('value3','value4')
console.log(zi)
多态
//父类
function Fu(value1,value2){
this.keys1 = value1,
this.keys2 = value2
}
Fu.prototype.fun=function(a){console.log(a)}
//子类
function Zi(n,m,c){
Fu.call(this,n,m)
this.c=c
}
Zi.prototype=new Fu('value1','value2')
Zi.prototype.dd='qwe'
//实例化Zi()
var zi = new Zi('value3','value4','sdf')
console.log(zi)
闭包
//即 闭包函数 闭包变量
//可以访问其他函数内部变量的函数
//即 定义在函数内部的函数
//---------------------------------------------------------
//方法一
function a(){
var x=1
//x 闭包变量 不会销毁,可能造成内存泄漏
//b() 闭包函数
function b(){
console.log(x)
}
b()
}
a()
//-----------------------------------------------------
//方法二
function a(){
var x=1
//x 闭包变量 不会销毁,可能造成内存泄漏
(function(){
console.log(x)
})()
}
a()
//-----------------------------------------------------
//方法三
function a(){
var x=1
//x 闭包变量 不会销毁,可能造成内存泄漏
return function(){
console.log(x)
}
}
a()()