Js中一切都是对象，函数也是一个对象 。

函数的创建

声明函数

// 创建函数对象
function run(){
   console.log("Hello World")
}


// 调用函数
run()

// 打印函数内容(不调用)
 console.log(run)

// 函数类型
 console.log(typeof run) // function

函数表达式

// 函数表达式(匿名函数)
const fn3 = function () {
    console.log("函数表达式")

}

// 调用匿名函数
fn()

箭头函数

// 箭头函数(匿名函数)
const fn4 = () => {
    console.log("Hello!")


}

// 调用箭头函数
fn()

函数参数

函数传参

形式参数 。

• 在定义函数时，可以在函数中指定数量不等的形式参数（形参）
• 在函数中定义形参，就相当于在函数内部声明了对应的变量但是没有赋值

实际参数 。

• 在调用函数时，可以在函数的()传递数量不等的实参
• 实参会赋值给其对应的形参
• 参数：
  1.如果实参和形参数量相同，则对应的实参赋值给对应的形参
  2.如果实参多余形参，则多余的实参不会使用
  3.如果形参多余实参，则多余的形参为undefined

参数的类型 。

• JS中不会检查参数的类型，可以传递任何类型的值作为参数

// 函数表达式和箭头函数同理

function sum(x,y){
    console.log(x+y)
}

sum(1,3)   // 4

// 如果箭头函数只有一个参数，()可以省略不写
const fn = a => {
  console.log(a) // 6
}

fn(6)

// 定义参数时，可以给参数指定默认值
function sum(x,y=100){
  return x+y
}

// 默认值，会在没有对应实参时生效
sum(1) // 101

sum(1,2) // 3

函数返回值

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

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

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

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

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

return一执行函数立即结束 。

function fn(){
  return "hello world"
}
let result = fn()
console.log(result) // hello worldd

// 箭头函数的返回值简写：函数只有一个语句的时候，箭头函数的返回值可以直接写在箭头后,

const sum = (a,b) => a + b


// 如果在箭头函数后直接设置对象字面量返回值的时候，对象字面量需要()括起来
const fn () => ({"name":"li"})

作用域

作用域指的是一个变量的可见区域 。

全局作用域 。

• 全局作用域在网页运行时创建，在网页关闭时消耗 。

• 所有直接编写到script标签中的代码都位于全局作用域中 。

• 全局作用域中的变量是全局变量，可以在任意位置访问 。

局部作用域 。

• 块作用域 。

  • 块作用域是一种局部作用域 。

  • 块作用域在代码块执行时创建，代码块执行完毕它就销毁 。

  • 在块作用域中声明的变量是局部变量，只能在块内部访问，外部无法访问 。

函数作用域 。

• 函数作用域也是一种局部作用域 。

• 函数作用域在函数调用时产生，调用结束后销毁 。

• 函数每次调用都会产生一个全新的函数作用域 。

• 在函数中定义的变量是局部变量，只能在函数内部访问，外部无法访问 。

作用域链

当我们使用一个变量时，JS解释器会优先在当前作用域中寻找变量，如果找到了则直接使用,如果没找到，则去上一层作用域中寻找，找到了则使用如果没找到，则继续去上一层寻找，以此类推,如果一直到全局作用域都没找到，则报错变量名 is not defined 。

Window对象

• 在浏览器中，浏览器为我们提供了一个window对象，可以直接访问 。

• window对象代表的是浏览器窗口，通过该对象可以对浏览器窗口进行各种操作 。

• 除此之外window对象还负责存储JS中的内置对象和浏览器的宿主对象 。

• window对象的属性可以通过window对象访问，也可以直接访问(不适应window.) 。

// 函数就可以认为是window对象的方法

window.console.log("hello world ") // 等价于console.log

window.max = 100 // 向window对象中添加的属性会自动成为全局变量
console.log(max) // 100 等价于 console.log(window.max)

/* 
  var 用来声明变量，作用和let相同，但是var不具有块作用域
      - 在全局中使用var声明的变量，都会作为window对象的属性保存
      - 使用function声明的函数，都会作为window的方法保存
      - 使用let声明的变量不会存储在window对象中，而特殊存储在一个地方（无法访问）
      - var虽然没有块作用域，但有函数作用域

  */

function test(){
  a = 10 // 在局部作用域中，如果没有使用var或let声明变量，则变量会自动成为window对象的属性 也就是全局变量
}

变量提升

• 使用var声明的变量，它会在所有代码执行前被声明,所以我们可以在变量声明前就访问变量 。

• 函数的提升,使用函数声明创建的函数，会在其他代码执行前被创建,所以我们可以在函数声明前调用函数 。

• let声明的变量实际也会提升，但是在赋值之前解释器禁止对该变量的访问 。

• 变量和函数的提升同样适用于函数作用域 。

• 定义形参就相当于在函数中声明了对应的变量，但是没有赋值 。

立即执行函数

在开发中应该尽量减少直接在全局作用域中编写代码,要尽量编写的局部作用域,如果使用let声明的变量，可以使用{}来创建块作用域 。

立即执行函数（IIFE),是一个匿名函数，并且只会调用一次，可以使用IIFE创建一个一次性的函数作用域，避免变量冲突的问题 。

 (function() {
            console.log("立即执行匿名函数")
        }());

this

函数在执行时，JS解析器每次都会传递进一个隐含的参数,这个参数就叫做 this 。

• this会指向一个对象
• this所指向的对象会根据函数调用方式的不同而不同
• 以函数形式调用时，this指向的是window
• 以方法的形式调用时，this指向的是调用方法的对象（谁调用this，this就是谁）
• 通过this可以在方法中引用调用方法的对象

普通函数的this

// 函数形式调用时，this指向的是window   
function test(){
            console.log(this === window) // true
        }

// 以方法的形式调用时，this指向的是调用方法的对象   
	function get_this(){
         return this
    }

    const user  = Object()
    user.get = get_this

    console.log(user.get()) // user对象
    console.log(user.get() === user) // true

  const user  = Object()

    user.name = "li"
    user.set_name = function (name){
        this.name = name
    }


    user.set_name("q")
    console.log(user.name) // q

箭头函数的this

箭头函数没有自己的this，它的this由外层作用域决定,箭头函数的this和它的调用方式无关 。

  <script>



    function fn(){
        return this
    }

    const  fn1 = ()=>{
        return this
    }

    const obj = {
        // 简写方式，fn 等价于 fn:fn,

        fn, // obj，以及方法的形式调用
        fn1, // window，箭头函数定义在全局作用域
      
      	// 简写方式，等价于 say:function (){},
        say(){
            console.log(this) // obj

            function t(){
                console.log(this) // Window  以函数方式调用
            }

            t()  


            const t2 = () =>{
                console.log(this) // obj,箭头函数的this由外层决定，外层的this是obj
            }
            t2()
         }


    }

    console.log(obj.fn())
    console.log(obj.fn1())
    obj.say()
    </script>

严格模式

JS运行代码的模式有两种:

• 正常模式 。

  • 默认情况下代码都运行在正常模式中，在正常模式，语法检查并不严格
  • 它的原则是：能不报错的地方尽量不报错，这种处理方式导致代码的运行性能较差

• 严格模式 。

  • 在严格模式下，语法检查变得严格 。

  • 禁止一些语法、更容易报错、提升了性能 。

• 在开发中，应该尽量使用严格模式， 。

  • 这样可以将一些隐藏的问题消灭在萌芽阶段，同时也能提升代码的运行性能

"use strict" // 全局的严格模式,编写在全局作用域

  function fn(){
            "use strict" // 函数的严格的模式，编写在函数内部
        }

最后此篇关于Js函数的文章就讲到这里了,如果你想了解更多关于Js函数的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。