js css html

Javascript基础笔记(3)-函数

2023-02-20  本文已影响0人  布拉德澈

一、函数基本使用

函数就是语句的封装,具有“一次定义,多次调用”的优点。
使用函数可以简化代码,让代码更具有可读性

(一)、函数的定义

函数必须先定义再使用,使用\color{red}{function}关键字定义函数

//函数定义1
function  函数名(参数) { 
         // 函数体语句 
}

函数表达式:var fun = function(){ //函数体语句}

(二)、函数调用

执行函数体中的所有语句,就是“调用函数”。
在函数名后书写圆括号即是调用。fun() //调用函数

(三)、函数的参数

参数是函数内的一些待定值,在调用函数时,传入参数的具体值,完成功能。
参数可多可少,也可以没有。多个参数之间用逗号隔开。

函数的参数.png
参数传递.png

(四)、函数的返回值

函数体内可以使用return关键字表示\color{red}{函数的返回值}
遇见return即退出函数

function sum(a, b) {
    return a + b;
}
console.log(sum(3, 5));

调用一个有返回值的函数,可以被当作一个普通值,从而以出现在任何可以书写值的地方.

function sum(a, b) {
    return a + b;
}
var result = sum(3,4) * sum(5,6);

二、递归

函数的内部语句可以调用这个函数本身,从而发起对函数的一次迭代。在新的迭代中,又会执行调用函数自身的语句,从而又产生一次迭代。当函数执行到某一次时,不再进行新的迭代,函数被一层一层返回,函数被递归。

递归要素

//递归函数
function factorial(n) {
    //求n的阶乘
    if(n==1) return 1;
    return n * factorial(n - 1);
}

三、全局变量与局部变量

(一)变量作用域

1.javascript是函数级作用域编程语言 :\color{red}{变量只在其定义时的function内部有意义}
形参也是局部变量

局部变量.png

2.全局变量:如果不将变量定义在任何函数内部,这个变量就是\color{red}{全局变量},它的任何函数内部都可以被访问和更改。

var a = 10;
function fun() {
    a++;
    console.log(a);  //输入11
}
fun();
console.log(a);   //输入11

3.遮蔽效应:如果函数中也定义了和全局同名的变量,则函数内部变量会将全局变量“遮蔽”。

(二)作用域链

函数内部也可以定义一个函数。和局部变量类似,定义在一个函数内部的函数时局部函数。

function fun() {
    function inner() {
        console.log('你好!');
    }
    inner();
}
fun();
var a = 10;
var b = 20;

function fun() {
    var c = 30;
    function inner() {
        var a = 40;
        var d = 50;
        console.log(`a=${a}`, `b=${b}`, `c=${c}`, `d=${d}`);
    }
    inner();
}
fun();  //a=40 b=20 c=30 d=50

(三)闭包

function func() {
    var name = 'brad';
    function innerFun() {
        console.log(name);
    }
    return innerFun;
}
var inn = func();
inn();

javascript函数会产生闭包(closuer)。 闭包是函数本身和该函数声明时所处的环境状态的组合。


闭包.png

函数能够"记忆住"其定义时所处的环境,即使函数不在其定义的环境中调用,也能访问定义时所处环境的变量。

①-记忆性

当闭包产生时,函数所处环境的状态会始终保存在内存中,不会再外层函数调用后被自动清除。

//闭包记忆性 示例
function createCheckTemp(standerdTemp) {
    function checkTemp(n) {
        if (n <= standerdTemp) {
            console.log("检测正常");
        } else {
            console.log("参数偏高")
        }
    }
    return checkTemp;
}
var checkTemp_A = createCheckTemp(37);
var checkTemp_B = createCheckTemp(36);
checkTemp_A(39)
checkTemp_B(35)

②-模拟私有变量

上一篇 下一篇

猜你喜欢

热点阅读