函数的定义,3种声明方式
- 匿名函数 // var fn = function(){xxx}//虽然它是匿名函数但是它有哦name属性//
- 具名函数 // function fn3(){'fn3它是一个变量'}//这样写,fn3作用域是全域//var fn4 = function fn5(){}//这样写的函数它的作用域是他本身
- 箭头函数//箭头函数有多种写法:
var fn6 =i=>i+1 //只有一个参数的写法
var fn6(i,j)=>i+j //这是有多个参数的时候
var fn6(i,j)=>{console.log(1);return i+j} //这是有多个参数,多个语句的时候,如果只有一个语句可以省略花括号,省略return
具名函数和匿名函数的却别就在于有没有函数名,但是它们都有name属性
三者没有多大的却别,只是在用this的时候稍有不同
词法作用域(静态作用域)
- 当浏览器看到一串代码,不会马上执行,而是建立一个抽象词法树
var global1 = 1
function fn1(param1){
var local1 = 'local1'
var local2 = 'local2')
function fn2(param2){
var local2 = 'inner local2'
console.log(local1)
console.log(local2)
}
function fn3(){
var local2 = 'fn3 local2'
fn2(local2) // 当执行fn3时,调用了fn2(local2),那执行fn2函数时,究竟会输出哪个local2呢?//答案是fn2函数里面声明的local2,因为JavaScript引擎是根据词法树找变量的
}
}
词法树是根据语义找变量,而不是值
var a = 1
function b (){
console.log(a) //根据JavaScript引擎工作原理,顺着词法树找,可以确定的是a是全局作用域下的a,至于它的值是多少是不确定的
}
a= 2 //这句代码就影响了a的最终输出值
b()
什么是call stack(先进后出数据结构)
- stack先进后出,是干草堆的意思,JavaScript的执行栈,就是先进后出;如果其中还嵌套着函数,就像盗梦空间一样~~!!!//不同的函数就是不同的梦境,执行函数内部的嵌套函数;或者return 另外一个函数,都可以穿越梦境
- 调用栈,是理解调用代码的顺序逻辑//草,我都懂了学这玩意~~
重点来了:this arguments
- 要理解this首先要学会用call调用函数,f()其实就是f.call()的阉割版
function f(){
console.log(this)
console.log(arguments)
}
f.call()//this 就是 call ()第一个参数！call 的其他参数统称为 arguments,arguments是一个伪数组
f.call({name:frank})
f.call(10,1) //输出的this是一个Number(10) ,因为this必须是对象,this是函数与对象之间的羁绊
为什么JavaScript要有this呢?
var person = {
name: 'frank',
sayHi: function(person){
console.log('Hi, I am' + person.name)
},
sayBye: function(person){
console.log('Bye, I am' + person.name)
},
say: function(person, word){
console.log(word + ', I am' + person.name)
}
}
person.sayHi(person)
person.sayBye(person)
person.say(person, 'How are you')
上面的代码就是没有this的代码//好麻烦啊~~ 能不能不写参数对象呢?就像下面的代码 ,于是创造了this关键字
person.sayHi()
person.sayBye()
person.say('How are you')
所以源代码就要改了
var person = {
name: 'frank',
sayHi: function(){
console.log('Hi, I am' + this.name)
},
sayBye: function(){
console.log('Bye, I am' + this.name)
},
say: function(word){
console.log(word + ', I am' + this.name)
}
}
// 如果你不想吃语法糖
person.sayHi.call(person)
person.sayBye.call(person)
person.say.call(person, 'How are you')//这三句和前面的三句是等价的
person.sayHi.call({name:'haha'}),这时 sayHi 里面的 this 就不是 person
//总结：关键字this 是 call 的第一个参数,因为 this 是参数,所以只有在调用的时候才能确认this
// 所以call的作用就是可以指定this对象,但是有个问题,因为用call的时候,具体参数是要罗列出来的,那当我们使用一个不知道长度,或者长度过长的数组,不就惨了?所以apply应运而生,apply就是call的另外一个版本
bind
- call 和 apply 是直接调用函数，而 bind 则是返回一个新函数（并没有调用原来的函数），这个新函数会 call 原来的函数，call 的参数由你指定。
- 一句话,因为call的第一个参数是this,所以当遇多层函数嵌套的代码时候,this的值就难以确定了~~!!!!!!bind就是来解决多层函数嵌套中的this指定的
柯里化//简单来说就是,一个A函数有多个参数,然后把A函数改写,把其中一个参数固定下来,就形成了一个新的B函数;A与B的区别就在于,B函数中的某个参数是常量,被固定了的
function sum(x,y){
return x+y
}
function addOne(y){
return sum(1+y)
}
高阶函数:在数学和计算机科学中,高阶函数是指满足一下其中一个条件的函数//实际中,经常满足两个条件
- 接受一个或者多个函数作为输入
- 输出一个函数
回调
- 名词形式:被当做参数的函数就是回调
- 动词形式:调用这个回调
注意回调和异步没有任何关系
构造函数
返回对象的函数就是构造函数,一般首字母大写
call/apply/bind的使用
- call：call 是函数的正常调用方式，并指定上下文 this。
apply：apply 的作用和 call 一样，只是在调用的时候，传参数的方式不同。区别是 apply 接受的是数组参数，call 接受的是连续参数。如下代码：
function add(a,b){
return a+b;
}
add.call(add, 5, 3); //8
add.apply(add, [5, 3]); //8
- bind：bind 接受的参数跟 call 一致，只是 bind 不会立即调用，它会生成一个新的函数，你想什么时候调就什么时候调。如下代码：
function add(a, b){
return a+b;
}
var foo1 = add.bind(add, 5,3);
foo1(); //8
var foo1 = add.bind(add, 5,3);
foo1(); //8
