11前端核心技术-JavaScript数组

目录

JavaScript数组

什么是数组?

创建数组

数组存储

JavaScript 函数（高级）

函数参数

变量的作用域

函数参数数组Arguments

函数返回值

JavaScript数组API

concat()

fill()

join()&toString()

push()

pop()

unshift()

shift()

reverse()

slice()

splice()

forEach()

---

JavaScript数组

什么是数组?

数组是使用单独的变量名来存储一系列的多个值。如：可以用数组来保存一个会员用户的用户名、帐号、密码、电话号码等等。

创建数组

创建一个数组，有2种方法

使用new Array("张三","zhangshan")创建数组

//创建名字为user的数组，里面有四个值
var user = new Array("张三","zhangshan","123456","13594876584");
//或者
var user = new Array();
user[0] = "张三";
user[1] = "zhangshan";
user[2] = "123456";
user[3] = "13594876584";

使用方括号var user = ["张三","zhangshan"]

//创建名字为user的数组，里面有四个值
var user = ["张三","zhangshan","123456","13594876584"];

 

数组存储

• 栈内存 - 用于存储局部变量，数据使用完（程序退出局部变量作用域后），所占内存自动释放。
• 堆内存 - 用于存储数组和对象，通过new建立的实例都存放在堆内存中。

普通变量和数组的保存方式不同，如下图：

JavaScript 函数（高级）

函数参数

函数名后面的括号里面写的就是参数。参数的作用就是用于函数内部和函数外部数据的传递。也就是说：可以通过参数把函数外面的数据传入函数内部，并在内部使用，而且不会改变外部数据的值。

参数其实也就是变量。

function functionName(parameter1, parameter2, parameter3) {
    // 要执行的代码…… 
}

 

变量的作用域

变量的位置不同，分为全局变量和局部变量

• 全局变量 - 作用范围是所有代码块，也就是说在任何一个位置都可以直接访问全局变量
• 局部变量 - 作用范围是某一个代码块内部，也就是说只能在当前代码块内部使用。

函数参数数组Arguments

参数数组又叫可变参数，可以接受任意多个参数，而且创建函数的适合不需要指定参数的个数，再使用函数的时候确定参数个数即可。

<script type="text/javascript">
		x = sumAll(1, 123, 500, 115, 44, 88);

		function sumAll() {
			var sum = 0;
			for(var i = 0; i < arguments.length; i++) {
				sum += arguments[i];
			}
			return sum;
		}
		
		document.write(x)
	</script>

函数返回值

有时，我们会希望函数将值返回调用它的地方。

通过使用 return 语句就可以实现。

在使用 return 语句时，函数会停止执行，并返回指定的值。

//定义函数
function myFunction() {
	var x = 5;
	return x;//在这里返回一个值，并且结束函数
	console.log(x);//这条语句不会执行
}

//使用函数
var ret = myFunction()//使用函数的时候会获得函数的返回值，并保存在ret变量里

JavaScript数组API

concat()

连接两个或多个数组

array1.concat(array2, array3, ... , arrayX);

fill()

用一个固定值替换数组的元素。（注意: IE 11 及更早版本不支持 fill() 方法。）

array.fill(value, start, end);

join()&toString()

数组变成字符串

push()

向数组末尾添加一个或多个元素，并返回新的长度

array.push(item1, item2, ..., itemX);

pop()

删除数组的最后一个元素并返回删除的元素

unshift()

向数组的开头添加一个或更多元素，并返回新的长度

array.unshift(item1,item2, ..., itemX)

shift()

删除并返回数组的第一个元素

reverse()

反转数组的元素顺序

slice()

提取数组部分元素

array.slice(start, end);

参数	描述
start	可选。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数， 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。

 

splice()

添加/删除项目，然后返回被删除的项目

该方法会改变原始数组。

arrayObject.splice(index,howmany,item1,.....,itemX);

参数	描述
index	必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。
howmany	必需。要删除的项目数量。如果设置为 0，则不会删除项目。
item1, ..., itemX	可选。向数组添加的新项目。

forEach()

调用数组的每个元素

注意: forEach() 对于空数组是不会执行回调函数的。

array.forEach(function(currentValue, index, arr), thisValue)

参数	描述
function(currentValue, index, arr)	必需。 数组中每个元素需要调用的函数。 函数参数:currentValue必需。当前元素index可选。当前元素的索引值。arr可选。当前元素所属的数组对象。
thisValue	可选。传递给函数的值一般用 "this" 值。 如果这个参数为空， "undefined" 会传递给 "this" 值