JavaScript-04

JavaScript

Posted by yulonglin on 2019-04-23

1 数组

1.1 数组的概念

  • 数组可以把一组相关的数据一起存放,并提供方便的访问(获取)方式。
  • 数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。

1.2创建数组

1
2
3
4
5
6
7
8
9
JS创建数组有两种方式


//1.利用 new 创建数组
var 数组名=new Array(); //创建一个新的空的数组

//2.利用数组字面量创建数组

var 数组名=['1','2'];

1.3获取数组中的元素

1
2
3
4
5
索引(下标):用来访问数组元素的序号(数组下标从0开始)。


var arry=['1','2','3']
arry[2]; //获取数组的第三个值

1.4便利数组

便利

数组遍历: 把数组中的每个元素从头到尾都访问一次(类似学生的点名)。

可以通过 for 循环索引遍历数组中的每一项

1
2
3
4
5
6
var arr = ['red','green', 'blue'];
for(var i = 0; i < arr.length; i++){
console.log(arr[i]);
console.log(arr.length); //数组的长度
}
arr[3]='pink'; //新增新数据

2 函数

2.1函数的概念

1
在JS里面,可能会定义非常多的形同代码或者功能相似的代码,这些代码可能需要大量重复使用。

虽然 for循环语句也能实现一些简单的重复操作,但是比较具有局限性,此时我们就可以使用 JS 中的函数。

函数:就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用

2.2函数的使用

1
2
3
4
//声明函数
function 函数名(){
//函数体代码
}
  • 调用的时候千万不要忘记添加小括号

  • 口诀:函数不调用,自己不执行

    注意:声明函数本身并不会执行代码,只有调用函数时才会执行函数体代码。

函数的封装

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

2.3 函数的参数

函数参数语法

1
在声明函数时,可以在函数名称后面的小括号中添加一些参数,这些参数被称为形参,而在调用该函数时,同样也需要传递相应的参数,这些参数被称为实参。
1
2
3
4
5
6
// 带参数的函数声明
function 函数名(形参1, 形参2 , 形参3...) { // 可以定义任意多的参数,用逗号分隔
// 函数体
}
// 带参数的函数调用
函数名(实参1, 实参2, 实参3...);

小结:

  • 函数可以带参数也可以不带参数
  • 声明函数的时候,函数名括号里面的是形参,形参的默认值为 undefined
  • 调用函数的时候,函数名括号里面的是实参
  • 多个参数中间用逗号分隔
  • 形参的个数可以和实参个数不匹配,但是结果不可预计,我们尽量要匹配

2.4函数返回值

1
2
3
4
5
6
7
// 声明函数
function 函数名(){
...
return 需要返回的值;
}
// 调用函数
函数名(); // 此时调用函数就可以得到函数体内return 后面的值

break ,continue ,return 的区别

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

2.5 arguments的使用

1
当不确定有多少个参数传递的时候,可以用 arguments 来获取。在 JavaScript 中,arguments实际上它是当前函数的一个内置对象。所有函数都内置了一个 arguments 对象,arguments 对象中存储了传递的所有实参。
1
arguments展示形式是一个伪数组,因此可以进行遍历。伪数组具有以下特点:
  • 具有 length 属性

  • 按索引方式储存数据

  • 不具有数组的 push , pop 等方法

    注意:在函数内部使用该对象,用此对象获取函数调用时传的实参。

2.6函数的两种声明方式

1
2
3
4
5
6
7
8
9
10
11
//声明定义方式
function fn(){
//调用
}
fn();


var fn=function(){

}
fn(); //调用