开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第14天，点击查看活动详情

5、对象作为参数

<script>
        function fn(a){
            // console.log("a =", a)
            // console.log(a.name)
​
            // a = {} // 修改变量时，只会影响当前的变量
            a.name = "猪八戒" // 修改对象时，如果有其他变量指向该对象则所有指向该对象的变量都会受到影响
            console.log(a)
        }
​
        // 对象可以作为参数传递
        let obj = {name:"孙悟空"}
​
        // 传递实参时，传递并不是变量本身，而是变量中存储的值
        // fn(obj)
​
        // console.log(obj)
​
        let obj2 = {name:"沙和尚"}
        
        // 函数每次调用，都会重新创建默认值
        function fn2(a = {name:"沙和尚"}){
            console.log("a =", a)
            a.name = "唐僧"
            console.log("a =", a)
        }
​
        fn2() // 沙和尚 唐僧
        fn2() // 沙和尚 唐僧√ or 唐僧 唐僧×
</script>

6、函数作为参数

在JS中，函数也是一个对象（一等函数）

别的对象能做的事情，函数也可以

<script>
    function fn(a){
        console.log("a =", a)
        // a()
    }
​
​
    let obj = {name:"孙悟空"}
​
    function fn2(){
        console.log("我是fn2")
    }
​
    // fn(fn2)
​
    // fn(function(){
    //     console.log("我是匿名函数~")
    // })
​
    fn(()=>console.log("我是箭头函数"))
</script>

7、函数的返回值

在函数中，可以通过return关键字来指定函数的返回值

返回值就是函数的执行结果，函数调用完毕返回值便会作为结果返回

任何值都可以作为返回值使用（包括对象和函数之类）

如果return后不跟任何值，则相当于返回undefined

如果不写return，那么函数的返回值依然是undefined

return一执行函数立即结束

        <script>
            function sum(a, b) {
                // console.log(a + b)
                // 计算完成后，将计算的结果返回而不是直接打印
                return a + b
            }
​
            function fn() {
                // return {name:"孙悟空"}
                // return ()=>alert(123)
                // return
                alert(123)
                return
                alert(456)
            }
            let result = fn()
​
            // result = sum(123, 456)
            // result = sum(10, result)
​
            console.log("result =", result)
        </script>

8、箭头函数的返回值

箭头函数的返回值可以直接写在箭头后

如果直接在箭头后设置对象字面量为返回值时，对象字面量必须使用()括起来

    <script>
        //不用写return
        const sum = (a, b) => a + b
        const fn1 = (x) => x.name = "孙行者" 
        const fn = () => ({name:"孙悟空"})
        //三种写法
​
        let result = sum(123, 456)
        result = fn()
        console.log(result)
    </script>

9、作用域

作用域（scope）

• 作用域指的是一个变量的可见区域
• 作用域有两种：

全局作用域

• 全局作用域在网页运行时创建，在网页关闭时消耗
• 所有直接编写到script标签中的代码都位于全局作用域中
• 全局作用域中的变量是全局变量，可以在任意位置访问

局部作用域

块作用域

• 块作用域是一种局部作用域
• 块作用域在代码块执行时创建，代码块执行完毕它就销毁
• 在块作用域中声明的变量是局部变量，只能在块内部访问，外部无法访问

<script>
    let a = "变量a"
    {
        let b = "变量b"
        {
            {
                console.log(b)
            }
        }
    }
​
    {
        console.log(b)
    }
</script>

10、函数作用域

函数作用域

• 函数作用域也是一种局部作用域
• 函数作用域在函数调用时产生，调用结束后销毁
• 函数每次调用都会产生一个全新的函数作用域
• 在函数中定义的变量是局部变量，只能在函数内部访问，外部无法访问

    <script>
        function fn(){
            let a = "fn中的变量a"
​
            console.log(a)
        }
        fn()
        console.log(a)
    </script>

11、作用域链

• 当我们使用一个变量时，

JS解释器会优先在当前作用域中寻找变量，就近原则

如果找到了则直接使用

如果没找到，则去上一层作用域中寻找，找到了则使用

如果没找到，则继续去上一层寻找，以此类推

如果一直到全局作用域都没找到，则报错 xxx is not defined

    <script>
        // let a = 10
​
        {
            // let a = "第一代码块中的a"
            {
                // let a = "第二代码块中的a"
                // console.log(a)
            }
        }
​
        let b = 33
        function fn(){
            let b = 44
​
            function f1(){
                let b = 55
                console.log(b)
            }
​
            f1()
        }
        fn()
    </script>