【前端入门】JS函数从浅到深了解,内含特别注意的点哦~

112 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第4天,点击查看活动详情

函数大家在从小的数学学习中经常看到,这次让我们来从浅到深了解下JS的函数内容吧,本文为基础函数学习笔记~

学习js函数入门

通过条件判断和循环,函数可以实现非常复杂的逻辑。

  • function 函数定义;
  • abs 函数名称;
  • (x)括号内列出函数的参数,多个参数以,分隔;
  • { ... }之间是函数体,可以没有任何语句,也可以包含若干语句

一旦执行到return时,函数就执行完毕;如果没有return,还是会有输出,但输出为undefined

特别注意:function (x) { ... }是一个没有名的函数。这个函数赋值给了变量abs,通过变量abs就可以直接调用该函数。例如:

var abs = function (x) {
    if (x >= 0) {
        return x;
    } else {
        return -x;
    }
};

这里面有个神奇的定义arguments,利用它你可以获得调用者传入的所有参数。像是个Array,但又不是个Array

另,为了获取除了已定义参数ab之外的参数,ES6标准引入了rest参数。rest参数用...标识,只能写在最后。传入的参数先绑定ab,多余的参数以数组形式给变量rest,不需要arguments我们就能获得全部参数。例如下面:

function foo(x, y, ...rest) {
    console.log('x = ' + x);
    console.log('y = ' + y);
    console.log(rest);
}

foo(1, 2, 3, 4, 567);
// 结果:
// x = 1
// y = 2
// Array [ 3, 4, 5,6,7 ]

foo(0);
// 结果:
// x = 0
// y = undefined
// Array []
  • 有个大坑:JavaScript引擎有一个在行末自动添加分号的机制,如果不仔细看,会自动在行末给你加上一个分号,导致后续行代码都不会被执行,是执行不到了,导致结果有问题。建议新手同学多检查~

  • 关于作用域,用var申明的变量实际上是范围的。只能在函数体里起作用,在外部是无效果的。如果两个不同的函数各自申明了同一变量,那么该变量只在各自的函数体内起作用。(特别地:当js中函数存在嵌套关系的时候,内部函数可以引用到外部函数变量,反之不可)