跳到主要内容

function 函数

基本定义​

  • 当我们需要重复操作一大段步骤时,如果每次都复制粘贴一份,不仅麻烦,还占用空间
  • 此时我们用 {} 把这堆代码包起来,并起个名字,并用 function 关键字标记,就可以直接用名字 + () 来调用此段代码,即为函数
// 定义
function 函数名()
{
    // 执行代码
}

// 调用
函数名()
  • 示例代码
function 函数示例() {
    logd("====")
    logd("执行1")
    logd("执行2")
    logd("执行3")
}

函数示例()
函数示例()

// 返回 ====
// 返回 执行1
// 返回 执行2
// 返回 执行3
// 返回 ====
// 返回 执行1
// 返回 执行2
// 返回 执行3

带参数的函数​

  • 写代码时经常会定义一些变量/数据, 提供给后续使用
  • 而在函数内部使用此变量时,我们可能会改变变量内容,但又不希望污染之前的变量
  • 此时我们引入了函数参数的功能
  • 当变量通过函数参数传入时,相当于新定义了一个变量来接收之前变量的内容,并跟之前的变量隔离,互不影响
// 定义
function 函数名(参数1, 参数2, ...)
{
    // 执行代码
}

// 调用
函数名(变量1, 变量2, ...)
  • 示例代码
function 函数示例(参数1, 参数2, 参数3) {
    logd("传入参数",参数1,参数2,参数3)
    参数1++
    参数2 = 5
    参数3 = "abc"
    logd("修改后", 参数1,参数2,参数3)
}

let a = 1, b = 2, c = 3
函数示例(a, b, c)
logd("原变量",a,b,c)

// 返回 传入参数,1,2,3
// 返回 修改后,2,5,abc

// 返回 原变量,1,2,3

值传递/引用传递​

  • 变量通过参数传递时,并不都是互不影响,分为值传递和引用传递两种
  • 值传递,即参数接收的是变量的副本,函数内部修改后,不会影响之前的变量的值,如数字,字符串等
  • 引用传递,即传入的是之前变量的引用(内存地址)(数据类型结构复杂,不利于存储),函数内部对参数的修改会影响原始数据,如对象,数组等
function 函数示例(参数1, 参数2, 参数3) {
    参数1.key = 2
    参数2[0]=3
    参数3 = "abc"
    logd( JSON.stringify(参数1))
    logd(JSON.stringify(参数2))
    logd(JSON.stringify(参数3))
}

let obj = {key :1}, arr = [1,2,3], obj2 = {aaa:1}
函数示例(obj, arr, obj2)
logd(JSON.stringify(obj))
logd(JSON.stringify(arr))
logd(JSON.stringify(obj2))

// 返回 {"key":2}
// 返回 [3,2,3]
// 返回 "abc"

// 返回 {"key":2}
// 返回 [3,2,3]
// 返回 {"aaa":1}

参数默认值​

  • 函数的参数是可以不填的,并不会报错, 参数值默认为 undefined
function test(a) {
    logd("参数", a)
}

test(1)
test()
// 返回 参数 1
// 返回 参数 undefined
  • 如果我们想为参数设置一个默认值, 当我们不填参数时自动初始化参数
function test(a) {
    a = a || 1
    logd("参数", a)
}

test(1)
test()
// 返回 参数 1
// 返回 参数 1

获取所有参数​

  • 当我们需要定一个函数, 但是不知道参数的个数, 此时我们可以用 arguments 来获取所有参数
function test() {
    logd("参数", JSON.stringify(arguments))
    for (let i = 0; i < arguments.length; i++) {
        logd(arguments[i])
    }
}
test()
test(1,"sfds",["a","b"], {a:1,b:2})

// 返回 参数 {}

// 返回 参数 {"0":1,"1":"sfds","2":["a","b"],"3":{"a":1,"b":2}}
// 返回 1
// 返回 sfds
// 返回 a,b
// 返回 [object Object]

带返回值的函数​

  • 有时候,我们希望将函数中计算的结果传递出来
  • 此时需要借助 return 关键字来返回
function 数字相加(参数1, 参数2) {
    return 参数1 + 参数2
}

logd(数字相加(1, 2))
// 返回 3

let 返回值 = 数字相加(1, 2)
logd(返回值)
// 返回 3

退出函数​

  • 当函数进行到一半时, 我们希望直接退出函数,不再继续进行下去,也是用 return 来实现
function test() {
    logd(1)
    logd(2)
    return
    logd(3)
}

test()

// 返回 1
// 返回 2

特殊用法​

匿名函数​

  • 定义时不需要定义函数名,直接用 function 关键字定义,可以用变量来接收此函数,并以变量名为函数名
let a = function () {
    logd(1)
}

a()

自执行函数​

  • 常用于一些插件的初始化,避免忘记执行
  • 会自动处理代码块中的变量,不会污染外部
(function () {
    let x = 1
    logd(x)
})()
logd(x)
// 返回 1
// 返回 ReferenceError: "x" is not defined

箭头函数​

  • 箭头函数,是es6的新特性,语法糖,用 => 代替 function 关键字
  • 箭头函数,没有 this 指向,所以不能用 this
let a = (参数) => {
    logd(参数)
}
a(1)

// 返回 1
  • 如果函数比较简单,并且带有返回值,可以省略{}
let a = (参数) => 参数 + 1
logd(a(1))

// 返回 2