js day24

一、函数声明与表达式

1.函数声明

function fn(){
    console.log('hello world');
}
fn();

fn();
function fn(){
    console.log('HELLO JS');
}   
//函数的声明可以把函数的调用放在任何位置都可以执行

2.函数表达式

相当于把一个匿名函数赋值给一个变量

var foo=function(){
    console.log('hello function');
    }
    foo();

//函数表达式中函数的调用不可以放在顶部,会报错

二、立即执行函数

我们之前使用的函数都是先定义,后调用。在JavaScript中我们可以定义一个函数,让他在定义的时候直接调用,我们叫他立即执行函数

要想立即执行函数能做到立即执行,要注意两点,
一是函数体后面要有小括号(),
二是函数体必须是函数表达式而不能是函数声明。

案例

(function(test){
    console.log(test);
})(123)
 
 !(function(test){
    console.log(test);
})(123)
              
+(function(test){
    console.log(test);
})(123)
             
-(function(test){
    console.log(test);
})(123)

var fun=function(test){
    console.log(test);
}(123456);

//除了使用()运算符之外,!,+,-,=等运算符都能起到立即执行的作用。这些运算符的作用就是将匿名函数或函数声明转换为函数表达式
for(var i=0;i<10;i++){
    setTimeout(function(){
        console.log(i);
    },1000)
上面的代码不会输出数字 0 到 9,而是会输出数字 10 十次

想到得到数字0-9,可以使用匿名函数

for(var i=0;i<10;i++){
    (function(e){
        setTimeout(function(){
            console.log(e)
        },1000)
    })(i)
}

三、闭包

闭包是依赖于函数的,因为函数是js中唯一拥有自身作用域的结构

1)函数的作用域

function fn1(){
    var a=100;
    console.log(a);
}
fn1();

function fn2(){
    var b=200;
    console.log(2);
}
fn2();
两个单独的函数,分别都有自己的作用域,并且只能访问自己作用域中的变量,而无法访问其他作用域中的变量

如果想要两个函数访问其他函数作用域中的变量,这时候就需要函数的嵌套。这时候就会形成闭包

闭包:闭包是指有权访问另一个函数作用域中的变量的函数,也就是说,当函数嵌套的时候,我们可以叫内部函数为闭包,利用闭包的特性,我们可以通过返回值的方式得到内部函数中的变量
function fn1(){
    var a=100;
    console.log(a);
    function fn2(){
        var b=10;
        console.log(b);
        console.log(a);

        return b;
    }
    return fn2;
}
fn1();
function fun1(){
    var m=3;
    function fun2(){
        var n=5;
        return n;
    }
    return fun2()
}
console.log(fun1);//5

//return n 相当于把n的值给了fun2函数,所以先在fun2函数的值就是5.再return fun2就相当于把fun2的值再给了函数fun1;所以最后输出fun1的值为5

上面的代码中,我们通过两个返回值把内部函数的变量暴露出来,让全局作用域可以获取到这个变量,我们还可以进一步改变代码,让内部函数暴露,而不是让内部函数中的变量暴露

function fun1(){
    var n=5;
    function fun2(){
        var m=3;
        return m;
    }
    return fun2;
}
             
console.log(fun1());

你可能感兴趣的:(js day24)