文章目录
71 数组
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
// 使用字面量来创建数组
// 语法:[]
var arr = [];
// 使用字面量创建数组时,可以在创建时就指定数组中的元素
var arr = [1, 2, 3, 4, 5, 10];
// 使用构造函数创建数组时,也可以同时添加元素,将要添加的元素作为构造函数的参数传递
// 元素之间使用,隔开
var arr2 = new Array(10, 20, 30);
// 创建一个数组,数组中只有一个元素10
arr = [10];
// 创建一个长度为10的数组
arr2 = new Array(10);
// 数组中的元素可以是任意的数据类型
arr = ["hello", 1, true, null, undefined];
// 也可以是对象
var obj = {name: "孙悟空"};
arr[arr.length] = obj;
arr = [{name: "孙悟空"}, {name: "猪八戒"}, {name: "沙和尚"}]
// 也可以是一个函数
arr = [function(){alert(1)}, function(){alert(2)}];
arr[0]; // alert(1)
// 数组中也可以放数组,如下这种数组称为二维数组
arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
arr[0]; // 1, 2, 3
</script>
<style>
</style>
</head>
<body>
</body>
</html>
72 数组的方法
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
// 创建一个数组
var arr = ["孙悟空", "猪八戒", "沙和尚"];
/*
push()
该方法可以向数组的末尾添加一个或多个元素,并返回数组的新的长度
可以将要添加的元素作为方法的参数传递,这样这些元素将会自动添加到数组的末尾
该方法会将数组新的长度作为返回值返回
*/
var res = arr.push("唐三藏", "白龙马");
console.log(res); // 6
/*
pop()
该方法可以删除数组的最后一个元素,并将被删除的元素作为返回值返回
*/
res = arr.pop();
console.log(res); // 白龙马
/*
unshift()
向数组开头添加一个或多个元素,并返回新的数组长度
向前面插入元素以后,其他的元素会依次调整
*/
arr.unshift("牛魔王", "二郎神");
/*
shift()
可以删除数组的第一个元素,并将被删除的元素作为返回值返回
*/
res = arr.shift();
</script>
<style>
</style>
</head>
<body>
</body>
</html>
73 数组的遍历
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
// 创建一个数组
var arr = ["孙悟空", "猪八戒", "沙和尚"];
// 所谓的遍历数组,就是将数组中所有的元素都取出来
for(var i = 0; i < arr.length; i++){
console.log(arr[i]);
}
</script>
<style>
</style>
</head>
<body>
</body>
</html>
74 数组练习
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.toString = function(){
return "name = " + this.name + ",age = " + this.age;
};
//创建一个Person实例
var per = new Person("孙悟空", 18);
var per1 = new Person("猪八戒", 28);
var per2 = new Person("红孩儿", 8);
var per3 = new Person("白骨精", 18);
var per4 = new Person("二郎神", 38);
/*
将这些person对象放入到一个数组中
*/
var perArr = [per, per2, per3, per4, per5];
/*
创建一个函数,可以将perArr中的满18岁的Person提取出来,
然后封装到一个新的数组中并返回
arr:形参,要提取信息的数组
*/
function getAdult(arr){
// 创建一个新数组
var newArr = [];
// 遍历arr,获取arr中的Person对象
for(var i = 0; i < arr.length; i++){
// 判断Person对象的age是否大于等于18
// 如果大于等于18,则将这个对象添加到newArr中
var p = arr[i];
if(p.age >= 18){
newArr.push(p);
}
}
// 将新数组返回
return newArr;
}
var res = getAdult(perArr);
document.write(res);
</script>
<style>
</style>
</head>
<body>
</body>
</html>
75 forEach
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
/*
一般我们都是使用for循环去遍历数组
JS中还为我们提供了一个方法,用来遍历数组
forEach()
这个方法只支持IE8以上浏览器,
IE8及以下的浏览器均不支持该方法,所以如果需要兼容IE8则不要使用forEach,
还是使用for循环来遍历
*/
//创建一个数组
var arr = ["孙悟空", "猪八戒", "沙和尚", "白龙马", "唐三藏"];
/*
forEach()方法需要一个函数作为参数
像这种函数,由我们创建,但是不由我们调用的,称为回调函数。
数组中有几个元素函数就会执行几次,每次执行时,浏览器会将遍历到的元素以实参的形式传递进来,我们可以定义形参,来读取这些内容。
浏览器会在回调函数中传递三个参数
第一个参数,就是当前正在遍历的元素,
第二个参数,就是当前正在遍历的元素的索引
第三个参数,就是正在遍历的数组
*/
arr.forEach(function(a){
console.log("a = " + a);
});
arr.forEach(function(a, b, c, d){
console.log("d = " + d); // undefined
});
arr.forEach(function(value, index, obj){
console.log(obj == arr); // true
});
</script>
<style>
</style>
</head>
<body>
</body>
</html>
标签:arr,元素,71,JavaScript,Person,75,遍历,数组,var
From: https://blog.csdn.net/weixin_45980065/article/details/140604524