封装:将多个表达式整合成一个函数,从而可以进行反复利用,减少重复代码。并形成一个局部作用域,声名的变量只能在函数中使用,只暴露出调用函数的接口。
functionCat(){var say ='喵'this.toSay=function(){
console.log(say)}}
console.log(say)// undefined
console.log(newCat().toSay())// '喵'
继承:利用原型,让函数挂载到另一个函数的原型上,使函数可以使用父级函数的属性和方法。
functionTheName(){this.getName=function(){
console.log(this.name)}}functionCat(){this.name ='猫'}functionDog(){this.name ='狗'}
Cat.prototype =newTheName();
Dog.prototype =newTheName();var a =newCat(),
b =newDog()
a.getName()// 猫
b.getName()// 猫
多态:一个引用在不同情况下的多种状态。
functionDog(){this.name ='狗'this.say ='汪汪汪'this.toSay=function(){
console.log(this.name +'在'+this.say +'地叫')}}functionCat(){this.name ='猫'this.say ='喵喵喵'}var dog =newDog()
Cat.prototype = dog
var cat =newCat()
dog.toSay()// 狗在汪汪汪地叫
cat.toSay()// 猫在喵喵喵地叫
函数实例化
函数的实例化可以说是创建一个模板,通过创建的模板生成需要的数据
functionStudent(name,age,grade){this.name = name
this.age = age
this.grade = grade
}var student =newStudent('小不点',14,'六年级')
this、argument、return
this
全局:this指向window
函数:this指向函数的实例
改变this的几个方法 call,apply,bind
1)、call
functiona(){this.func=function(e){
console.log(this)
console.log(e)}}var b =newa()
b.func(1)// a {func: ƒ} 1
b.func.call(this,1)// window 1 第一个参数为指向的对象 第二个参数以及后面的参数为入参2)、apply
functiona(){this.func=function(one,two){
console.log(this)
console.log(one,two)}}var b =newa()
b.func(1,2)// a {func: ƒ}
b.func.apply(this,[1,2])// window 1 2 第一个参数为指向的对象 第二个参数为入参,必须是一个数组3)、bind
functiona(){this.func=function(one,two){
console.log(this)
console.log(one,two)}}var b =newa()
b.func(1,2)// a {func: ƒ}
b.func.bind(this)(1,2)// window 1 2 绑定后不会调用,需要添加(),才能调用
相同点:都可以改变this指向
不同点:call和apply都是改变this后马上调用,bind需要手动调用。apply的入参是一个数组。
arguments 类数组、 return 返回值
functionfunc(a,b){
console.log(arguments)// Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]var arr =[]for(var i =0;i < arguments.length;i++){
arr.push(arguments[i])}return arr
}var list =func(1,2)// [1,2]
箭头函数
特点:
1、箭头函数中,thsi永远指向他的父级
functionfunc(){leta=()=>{
console.log('a',this)// a func {}}functionb(){
console.log('b',this)// b window}a()b()}let c =newfunc()2、无法改变this 的指向
3、箭头函数种没有 arguments
4、箭头函数都是匿名函数,只能通过函数表达式来声明
5、箭头函数可以省略小括号、大括号和returnleta= b => console.log(b)