Web前端开发 孙俏 第十一章数组和函数

目录

11 JavaScript 数组和函数

11.1 数组

11.1.1 基本语法

11.1.1.1 数组声明

11.1.1.2 数组长度

11.1.1.3 数组元素

11.1.1.4 遍历数组

11.1.2 操作数组

11.2 函数

11.2.1 函数语句

11.2.1.1 函数声明和调用

11.2.1.2 函数参数

11.2.1.3 函数返回值

11.2.2 函数表达式

11.2.2.1 赋值给变量

11.2.2.2 赋值给对象属性

11.2.2.3 立即执行函数

11.2.2.4 箭头函数

11.2.3 函数嵌套

11.2.3.1 定义函数嵌套

11.2.3.2 内部函数访问外部函数变量

11.2.4 作用域和声明提升

11.2.4.1 作用域

11.2.4.2 声明提升

11.2.4.3 let定义变量

11.2.5 闭包

11.2.5.1 闭包的概念

11.2.5.2 闭包的应用


11 JavaScript 数组和函数

11.1 数组

11.1.1 基本语法

11.1.1.1 数组声明
  1. let 数组名=[数据列表];

  2. let 数组名=new array();

11.1.1.2 数组长度

一维数组长度是指数组包含元素的个数,二维数组长度是指行的个数。数组长度可以使用length属性获得

11.1.1.3 数组元素

通过数组名与下标的方式可以访问数组元素,数组元素下标从0开始

11.1.1.4 遍历数组

可以使用for语句遍历数组

11.1.2 操作数组

  1. toString()方法:

    let arr=[1,2,3];
    console.log(arr.toString());//"1,2,3"

  2. join()

    let arr=[1,2,3];
    console.log(arr.join());//"1,2,3"
    condole.log(srr.join("+"));//"1+2+3"

  3. push() and pop()

    let arr=[1,2,3];
    arr.push(4,5);//添加元素到数组尾部
    console.log(arr);//1,2,3,4,5
    let num=arr.pop();//删除元素并返回
    console.log(num);//5
    console.log(arr);//1,2,3,4

  4. shuift() and unshift()

    let arr=[1,2,3];
    let num=arr.shift();//删除第一个元素
    console.log(num);//1
    console.log(arr);//2,3
    arr.unshift(-1,-1);//添加元素到数组开头
    console.log(arr);//-1,-1,2,3
  5. sort()

    let arr=[2,1,3];
    arr.sort();//升序排序
    console.log(arr);//1,2,3
    let arr=["java","hello","script"];
    arr.sort();
    console.log(arr);//hello,java,script

  6. reverse()

    let arr=[1,2,3];
    arr.reverse();//逆序
    console.log(arr);//3,2,1

  7. concat()

    let arr=[1,3,5,7];
    let arrcopy=arr.concat(2,4,6,8);
    console.log(arrcopy);//[1,3,5,7,2,4,6,8]
    console.log(arr);//[1,3,5,7]

  8. slice()

    let arr = [0,1,2,3,4,5,6,7,8,9];
    //截取下标3以后所有元素,[3,4,5,6,7,8,9]
    let arrSubl = arr. slice(3);
    //截取下标3~5的元素,不包含结束下标元素,[3,4]
    let arrsub2 = arr.slice(3,5);
    //截取下标3~倒数第2个的元素,不包含结束下标元素,[3,4,5,6,7]
    let arrsub3 = arr.slice(3,-2);
    //截取下标倒数第4个~倒数第1个的元素,不包含结束下标元素,[6,7,8]
    let arrsub4 = arr.slice(-4,-1);

  9. indexOf() and lastIndexOf()

    let arr=[6,3,2,4,5,7,9]
    arr.indexOf(3);//从开头查找数字3,返回下标1
    arr.indexOf(5,2);//从开头查找数字5,返回下标4
    arr.lastIndexOf(7,-2);//从倒数第2个元素开始查找数字7,返回下标5。
    arr.lastIndexOf(7,-4);//从倒数第4个元素开始查找数字7,未找到,返回-1。
    arr.indexOf("9");//未找到,返回-1

  10. map()

    该方法用于对每个数组元素运行指定函数映射结果组成新的数组并返回。

    let arr=[1,2,3,4,5];
    let newArr=arr.map(f);
    function f(x){
    return x*x;
    }

  11. reduce()

    该方法可以对数组每个元素运行指定函数作为累计器。数组元素依次汇集最终成为一个值。

    let arr=[1,2,3,4,5];
    let sum=arr.reduce(f);//sum结果为15
    function f(x){
    return x*x;
    }

  12. filter()

    该方法可以对数组每个元素运行指定函数过滤结果组成新的数组并返回。

    let arr=[1,2,3,4,5,6,7,8,9,10];
    let newArr=arr.filter(f);//[6,8,10]
    //过滤函数,求偶数元素。 
    function f(x){
    return x%2==0
    }

  13. every()

    该方法用于检测是否每个数组元素都符合函数中的条件。

    let arr=[1,2,3,4,5,6,7,8,9,10];
    arr.every(f);//测试每个元素是否都大于等于六,结果是false。 
    function f(x){
    return x>=6;
    }

  14. some()

    该方法用于检测是否有一些数组元素符合函数中的条件。

    let arr=[1,2,3,4,5,6,7,8,9,10];
    arr.some(f);//测试有些元素是否大于等于六,结果是true。 
    function f(x){
    return x>=6;
    }

  15. foreach()

    该方法为每个数组元素调用一次函数。

    let sum=0;//数组元素的和。
    let arr=[1,2,3,4,5,6,7,8,9,10];
    arr.foreach(f);
    concole.log(sum);//输出求和的结果,55
    function f(x){
        sum+=x;
    }

11.2 函数

函数分为两种形式,一种是函数语句,另一种是函数表达式。

11.2.1 函数语句

11.2.1.1 函数声明和调用
  1. 函数声明格式:

    function 函数名{
        //函数体
        return 返回值;
    }
  2. 无返回值的函数可直接用函数名调用;有返回值的函数,其返回值可以直接输出或赋值给其他变量.执行到return语句时,函数将停止执行,将返回值返回给主调函数。

  3. JavaScript会默认将函数声明提升到作用域顶部,所以函数声明可以放在函数定义之后。

11.2.1.2 函数参数

函数调用时会发生参数传递函数,参数可以是基本数据类型、数组、函数、对象等。

  1. arguments

    实参传递给函数形参时会被保存在名为arguments数组中,可以在函数内部引用这个数组。

  2. rest

    Java script函数允许接收任意多个实参,多余的实参以数组的形式传递给rest,用“,...”分割。

  3. 参数默认值

    函数参数可以在形参列表里用赋值的方式设置默认值。

  4. 函数作为参数

    函数的参数可以是另一个函数。

11.2.1.3 函数返回值

除基本类型外,函数返回值还可以是数组、对象和函数。

  1. 返回数组

  2. 返回对象

  3. 返回函数

11.2.2 函数表达式

函数表达式是以赋值形式使函数成为表达式的一部分。 此时可以带函数名或者不带函数名。带函数名的函数称为命名函数,否则为匿名函数。

let 变量|对象属性=function 函数名(){ };//命名函数的函数表达式
let 变量|对象属性=function (){    };//匿名函数的函数表达式
11.2.2.1 赋值给变量
  1. 命名函数

    let show=function f(){
    alert("hello world");
    };
    show();//用show变量调用f()函数

  2. 匿名函数

    可将匿名函数赋值给一个变量,再通过变量进行函数调用。

    let show=function (){
    alert("hello world");
    };
    show();//用show变量调用匿名函数
11.2.2.2 赋值给对象属性

将匿名函数赋值给对象属性也很常见。如果赋值给事件属性,则事件发生时调用该函数。

11.2.2.3 立即执行函数

匿名函数可以通过自调用方式来执行,此时也被称为立即执行函数。立即执行函数执行后被释放。通常适用于只被执行一次的函数,也常用于初始化工作。

(function(形参列表)){
//函数体
return 返回值
})(实参列表);
11.2.2.4 箭头函数

声明函数时用=>代替function关键字。

let sum=(x,y,z)=>{
    return x+y+z;
}
//等价于let sum=(x,y,z)=>x+y+z;
sum(1,2,3);//6

11.2.3 函数嵌套

11.2.3.1 定义函数嵌套

定义函数嵌套时,内部函数是外部函数私有的。内部函数只能在外部函数中调用。

11.2.3.2 内部函数访问外部函数变量

在函数嵌套时,内部函数可以直接访问外部函数的变量,反之则不可以。

11.2.4 作用域和声明提升

11.2.4.1 作用域
  1. 全局作用域:由整个javascript执行环境构成

  2. 局部作用域:也称为函数作用域,由函数声明{ }构成

  3. 块作用域:由{ }构成,如if语句和for语句里面的{ }也属于块作用域

11.2.4.2 声明提升
  1. 变量声明提升:在预编译阶段,全局作用域中声明的变量会提升至全局最顶层。局部作用域,即函数内声明的变量只会提升至该局部作用域最顶层。

  2. 函数声明提升:在预编译阶段,当前作用域的函数声明提升到整个作用域的最前面。

11.2.4.3 let定义变量

Late和var关键字定义变量在全局作用域和局部作用域中是类似的。但是let定义变量可以拥有块作用域。 不建议var作为关键字的原因是如果作为块作用域会被上升到全局变量。

11.2.5 闭包

11.2.5.1 闭包的概念

函数和其作用域绑定在一起构成闭包。正常就是内部函数返回到外部函数。

11.2.5.2 闭包的应用

常用于生成计数器、缓存等,内部函数计算给到外部。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

顾三小丁

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值