JavaScript函数

2021/7/25 20:36:23

编程Tag： javascript 函数 function var alert console window log

本文主要是介绍JavaScript函数，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

4、函数

4.1定义函数

定义方式一

绝对值函数
```
 function abs(x) {
        if (x>0){
            return x;
        }else {
            return -x;
        }
    }
```
一旦执行到return，代表函数结束，返回结果

如果没有执行return，函数执行完也会返回结果，结果就是undefined

定义方式二

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

function(x){…}这是一个匿名函数，但是可以把结果赋值给abs，通过abs就可以调用函数

调用函数

abs(10)
>10

abs(-10)
>10

参数问题，js可以传任意参数，也可以不传递参数

参数进来是否存在的问题，规避方法：

手动抛出异常

function abs(x) {
        if (typeof x != 'number'){
            throw 'Not a Number';
        }
        if (x>0){
            return x;
        }else {
            return -x;
        }
    }

arguments

arguments代表传递进来的所有参数，是一个数组
在这里插入图片描述

4、函数

4.1定义函数

定义方式一

绝对值函数
```
 function abs(x) {
        if (x>0){
            return x;
        }else {
            return -x;
        }
    }
```
一旦执行到return，代表函数结束，返回结果

如果没有执行return，函数执行完也会返回结果，结果就是undefined

定义方式二

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

function(x){…}这是一个匿名函数，但是可以把结果赋值给abs，通过abs就可以调用函数

调用函数

abs(10)
>10

abs(-10)
>10

参数问题，js可以传任意参数，也可以不传递参数

参数进来是否存在的问题，规避方法：

手动抛出异常

function abs(x) {
        if (typeof x != 'number'){
            throw 'Not a Number';
        }
        if (x>0){
            return x;
        }else {
            return -x;
        }
    }

arguments

arguments代表传递进来的所有参数，是一个数组

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cElRoVSk-1627212156342)(C:\Users\lenovo\AppData\Roaming\Typora\typora-user-images\image-20210719094531894.png)]

问题arguments包含所有参数，想使用多余的参数进行操作，需要排除已有的参数

if（arguments.length == 1）{
    
}else（arguments.length == 2）{
    
}

rest

ES6引入的新特性，获取除了已经定义的参数之外的所有参数

 function aaa(a,b,...rest) {
        console.log("a=>"+a);
        console.log("b=>"+b);
        console.log("rest=>"+rest);
    }

a=>1
b=>2
rest=>23,3,153,1,54,341,21,541

rest参数只能写在最后边，用…标识

4.2 变量的作用域

在js中，var 定义的变量实际是有作用域的

假设在函数体中声明，则在函数体外不可以使用（闭包）

 function qj() {
    var x = 1;
    x = x + 1;
    }
    x = x + 2;//Uncaught ReferenceError: x is not defined

如果两个函数使用了相同的函数名，只要在函数内部，就不冲突

 function a() {
    var x = 1;
    x= x + 1;
    }
    function b() {
        var x = 1;
        x = x + 1;
    }

提升变量的作用域

 function qj() {
        var x = "x" + y;
        console.log(x);
        var y = 'y';
    }

结果:xundefined

说明js的执行引擎，自动提升了y是声明，但是不会提升y的赋值

    function qj() {
      //  var a,b,c,d....
      //把所有变量提到前面统一定义
        
        var x = "x" + y;
        console.log(x);
    }

这是在js建立之初就存在的特性。

规范：所有的变量定义都放在函数的头部，不要乱放，便于代码的维护

全局变量

var x = 1;
function f(){
    console.log(x)
}
f();
console.log(x);

>1
>1

全局对象 window

var x = 'xxx';
alert(x);
alert(window.x);//默认所有的全局对象，自动绑定在window对象下

alert()本身也是window的变量

var x = 'xxx';

window.alert(x);

var old_window = window.alert();

//old_alert(x);

window.alert =  function () {

}
//alert() 失效了
window.alert(123);

//恢复
window.alert() = old_window;
window.alert(456);

js实际上只有一个全局作用域，任何变量（函数也可以视为变量），假设没有在函数的作用范围内找到，就会向外查找，如果在全局作用域都没有找到：

window.alert(x);

则会报错==ReferenceError==

规范

由于我们所有的全局变量都会绑定到window，如果不同的js文件，使用了相同的全局变量，就会产生冲突。免冲突的方法：

 //唯一全局变量
    var ChuanqiApp = {};
    
    //定义全局变量
    ChuanqiApp.name = 'chuanqi';
    ChuanqiApp.add = function (a,b) {
        return a + b;
    }

把自己的代码放入自己定义的唯一空间名字中，降低全局命名冲突的问题

==jQuery 》$()

局部作用域 let

  function aaa() {
        for (var i = 0; i < 100; i++) {
            console.log(i);
        }
        console.log(i+1);//i = 101
    }
//问题：i出了这个作用域还可以继续使用

ES6 let 关键字，解决局部作用域冲突的问题

//改进
  function aaa() {
        for (let i = 0; i < 100; i++) {
            console.log(i);
        }
        console.log(i+1);//i is not defined
    }

所以使用let定义局部作用域

常量

ES6之前，用大写字母定义常量

ES6引入常量关键词const

const PI = '3.14';//只读变量

PI = '123';//报错