数组、函数、作用域

• 1 JavaScript数组
• • 1.1 数组的概念
  • 1.2 创建数组
  • • 1.2.1 数组的创建方式
    • 1.2.2 利用new创建数组
    • 1.2.3 利用数组字面量创建数组[]
    • 1.2.4 数组元素的类型
  • 1.3 获取数组中的元素
  • • 数组的索引
  • 1.4 遍历数组
  • • 1.4.1 遍历
    • 1.4.2 数组的长度
  • 1.5 数组中新增元素
  • • 1.5.1 通过修改length长度新增数组元素
    • 1.5.2 通过修改数组索引新增数组元素
• 2 JavaScript函数
• • 2.1 函数的概念
  • 2.2 函数的使用
  • • 2.2.1 声明函数
    • 2.2.2 调用函数
    • 2.2.3 函数的封装
  • 2.3 函数的参数
  • • 2.3.1 形参和实参
    • 2.3.1 函数形参和实参个数不匹配问题
  • 2.4 函数的返回值
  • • 1、
    • 2、return终止函数
    • 3、函数没有return返回undefined
    • 4、 break ,continue ,return 的区别
  • 2.5 arguments的使用
  • 2.6 函数可以相互调用
  • 2.7 函数的两种声明方式
• 3 JavaScript作用域
• • 3.1 作用域
  • 3.2 变量作用域
  • • 3.2.1 全局变量
    • 3.2.2 局部变量
    • 3.2.3全局变量和局部变量的区别
    • 3.2.4 现阶段JS没有块级作用域
  • 3.3 作用域链

1 JavaScript数组

1.1 数组的概念

数组（Array）是指 一组数据的集合 ,其中的每个数据被称作 元素 ,在数组中可以 存放任意类型的元素 。数组是一种将 一组数据存储在单个变量名下 的优雅方式。

//普通变量一次只能存储一个值var num = 10;

//数组一次可以存储多个值var arr = [1,2,3,4,5];

1.2 创建数组

1.2.1 数组的创建方式

JS中创建数组有两种方式：

• 利用new创建数组
• 利用数组字面量创建数组

1.2.2 利用new创建数组

var 数组名 = new Array();
var arr = new Array();  //创建一个新的空数组

学完对象再看
注意 Array()，A要大写

1.2.3 利用数组字面量创建数组[]

var arr=[];//创建了一个空的数组
var arr1 = [1,2,3,老师,true];//使用数组字面量方式创建带初始值的数组
//我们数组里面的数据一定用逗号分隔
//数组里面的数据，称为数组元素

• 数组的字面量是方括号[]
• 声明数组并赋值称为数组的初始化
• 这种字面量方式也是我们以后最多使用的方式

1.2.4 数组元素的类型

数组可以存放任意类型的数据，例如字符串、数字、布尔值等。

var arrStus = [小白,12,true,28.9]

1.3 获取数组中的元素

数组的索引

索引（下标）：用来访问数组元素的序号（数组下标从0开始）

数组可以通过索引来访问、设置、修改对应的数组元素，我们可以通过 数组名[索引] 的形式来获取数组中的元素。

这里的访问就是获取得到的意思

格式：数组名[索引号] //索引号从0开始
如果没有这个数组元素，所以输出的结果是undefined

1.4 遍历数组

1.4.1 遍历

遍历：就是把数组中的每个元素从头到尾都访问一次

1.4.2 数组的长度

使用 数组名.length 可以访问数组元素的数量（数组的长度）
比如：arr.length(相当于python中的len(arr))

• 数组长度是索引的个数，不要跟索引号混淆
• arr.length 动态监测数组元素的个数

案例

数组转换为字符串

1.5 数组中新增元素

可以通过修改length长度以及索引号增加数组元素

1.5.1 通过修改 length长度 新增数组元素

• 可以通过修改 length长度来实现数组扩容的目的

• length属性是可读写的

   var arr = [red, green, blue, pink];
   arr. length = 7;
   console. log(arr) ;
   console. log(arr[4]);
   console. log(arr[5]);
   console. log(arr[6]);

其中索引号是4, 5, 6的空间没有给值,就是声明变量未给值,默认值就是 undefined

1.5.2 通过修改 数组索引 新增数组元素

新增数组元素，修改索引号， 追加 数组元素

如果索引号没有占用，则会追加到数组
如果里面有了，就会修改数组元素。（替换元素）

不要直接给 数组名赋值，否则里面的数组元素就没有了

• 可以通过修改数组索引的方式追加数组元素

• 不能直接给数组名赋值,否则会覆盖掉以前的数据

   var arr = [red ,green, blue, pink];
   arr[4] = hotpink ;
   console. log(arr) ;

这种方式也是我们最常用的一种方式。

2 JavaScript函数

2.1 函数的概念

函数：就是封装了一段可以被重复执行调用的的代码块
目的：就是让大量代码重复使用

2.2 函数的使用

函数在使用时分为两步：声明函数和调用函数
注意：声明函数本身并不会执行代码，只有调用函数时才会执行函数体代码

2.2.1 声明函数

function 函数名() {
    //函数体
}

• function声明函数的关键字，全部小写
• 函数是做某件事情，函数名一般是动词
• 函数不调用，自己不执行

2.2.2 调用函数

//调用函数
函数名();//通过调用函数名来执行函数体代码

• 调用时，千万不要忘记添加小括号
• 函数不调用，自己不执行

2.2.3 函数的封装

• 函数的封装是把一个或者多个功能通过 函数的方式封装起来，对外只提供一个简单的函数接口
• 简单理解：封装类似于将电脑配件整合组装到机箱中

2.3 函数的参数

我们可以利用函数的参数实现函数重复不同的代码

2.3.1 形参和实参

function 函数名 (形参1,形参2...) {//在声明函数的小括号里面是  形参（形式上的参数）
}
函数名(实参1,实参2...);//在函数调用的小括号里面是实参（实际的参数）

• 函数的参数可以有，也可以没有，个数不限
• 参数的作用：在 函数内部 某些值不能固定，我们可以通过参数在 调用函数时传递不同的值 进去
• 多个参数之间用逗号隔开
• 形参可以看做是不用声明的变量

2.3.1 函数形参和实参个数不匹配问题

1. 如果实参的个数和形参的个数一致，则正常输出结果
2. 如果实参的个数多于形参的个数，会取到形参的个数
3. 如果实参的个数小于形参的个数，NaN
4. 建议，我们尽量让实参的个数和形参相匹配
5. 在JS中，形参的默认值是undefined
   

2.4 函数的返回值

1、

函数的返回值格式：
function 函数名() {
    函数体；
    return 需要返回的结果;
}
函数名();

• 我们函数只是实现某种功能，最终的结果需要返回给函数的调用者 函数名(); 通过 return 来实现的
• 只要函数遇到return 就会把后面的结果 返回给函数的调用者 函数名() = return 后面的结果

2、return终止函数

• return之后的代码不被执行
• return只能返回一个值。如果用逗号隔开多个值，以最后一个为准

函数返回值注意事项：

3、函数没有return返回undefined

函数都是有返回值的

• 如果有return，则返回return后面的值
• 如果没有return，则返回undefined

4、 break ,continue ,return 的区别

• break :结束当前的循环体(如for、while )
• continue :跳出本次循环,继续执行下次循环(如for、while )
• return :不仅可以退出循环,还能够返回return语句中的值,同时还可以结束当前的函数体内的代码

2.5 arguments的使用

2.6 函数可以相互调用

2.7 函数的两种声明方式

3 JavaScript作用域

3.1 作用域

结果：30 20

3.2 变量作用域

在js中，根据作用域的不同，变量可以分为两种：

• 全局变量

• 局部变量

      //变量的作用域: 根据作用域的不同我们变量分为全局变量和局部变量
      // 1.全局变量: 在全局作用域下的变量在全局下都可以使用
      //注意如果在函数内部没有声明直接赋值的变量也属于全局变量
      var num = 10; // num就是一个全局变量
      console.log(num);
      function fn() {
          console.log(num);
      }
      fn();
      // console. log(aru);
      // 2.局部变量在局部作用域下的变量后 者在函数内部的变量就是局部变量
      function fun1(aru) {//注意:函数的形参也可以看做是局部变量
          var num1 = 30;//num1就是局部变量只能在函数内部使用
          num2 = 20; //没有声明直接赋值，全局变量
      }
      fun1();

3.2.1 全局变量

在全局作用域下声明的变量叫做全局变量(在函数外部定义的变量)。

• 全局变量在代码的任何位置都可以使用
• 在全局作用域 下，var声明的变量是全局变量
• 特殊情况下,在函数内不使用var声明的变量也是全局变量(不建议使用)

3.2.2 局部变量

在局部作用域下声明的变量叫做局部变量(在函数内部定义的变量)

• 局部变量只能在该函数内部使用
• 在函数内部var声明的变量是局部变量
• 函数的形参实际上就是局部变量

3.2.3全局变量和局部变量的区别

• 全局变量:在任何一个地方都可以使用,只有在浏览器关闭时才会被销毁,因此比较占内存
• 局部变量:只在函数内部使用,当其所在的代码块被执行时,会被初始化;当代码块运行结束后,就会被销毁,因此更节省内存空间

3.2.4 现阶段JS没有块级作用域

3.3 作用域链

• 只要是代码,就至少有一个作用域
• 写在函数内部的局部作用域
• 如果函数中还有函数,那么在这个作用域中就又可以诞生一 个作用域
• 根据在内部函数可以访问外部函数变 量的这种机制,用 链式查找 决定哪些数据能被内部函数访问,就称作 作用域链 （就近原则）

• 站在目标出发，一层一层的往外查找

运行结果：20