JavaScript-数组增删改查
- 非关键性的地方都不在贴图了直接上代码
let arr = ["a", "b", "c"];
需求
获取数组中索引为 1 的那个数据 (查)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
console.log(arr[1]);
</script>
</head>
<body>
</body>
</html>
将索引为 1 的数据修改为 m (改)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr[1] = "m";
console.log(arr);
</script>
</head>
<body>
</body>
</html>
将索引为 1 的数据修改为 d, 索引为 2 的修改为 e (改)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr[1] = "d";
arr[2] = "e";
console.log(arr);
</script>
</head>
<body>
</body>
</html>
将索引为
1的数据修改为 d, 索引为 2 的修改为 e (改) 除了如上的方式以外其实还有其它的实现方式如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
// 参数1: 从什么位置开始
// 参数2: 需要替换多少个元素
// 参数3开始: 新的内容
arr.splice(1, 2, "d", "e");
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求在数组最后添加一条数据 (增)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr[3] = "d";
console.log(arr);
</script>
</head>
<body>
</body>
</html>
push 方法可以在数组的最后新增一条数据, 并且会将新增内容之后数组当前的长度返回给我们。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
let res = arr.push("d");
console.log(res);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求在数组最后添加两条数据 (增)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr.push("d");
arr.push("e");
console.log(arr);
</script>
</head>
<body>
</body>
</html>
数组的 push 方法可以接收 1 个或 多 个参数。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr.push("d", "e");
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求在数组最前面添加一条数据 (增)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr[-1] = "m";
console.log(arr);
</script>
</head>
<body>
</body>
</html>
unshift 方法和 push 方法一样, 会将新增内容之后当前数组的长度返回给我们。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
let res = arr.unshift("m");
console.log(res);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求在数组最前面添加两条数据 (增)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr.unshift("m");
arr.unshift("w");
console.log(arr);
</script>
</head>
<body>
</body>
</html>
unshift 方法和 push 方法一样, 可以接收 1 个或 多 个参数。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr.unshift("m", "w");
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求删除数组最后一条数据 (删) 数组的 pop 方法可以删除数组中的最后一条数据, 并且将删除的数据返回给我们。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
let res = arr.pop();
console.log(res);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求删除数组最前面一条数据 (删) 数组的 shift 方法可以删除数组中的最前面一条数据, 并且将删除的数据返回给我们。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
let res = arr.shift();
console.log(res);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求删除数组中索引为 1 的数据 (删) 以下代码的含义: 从索引为 1 的元素开始删除 1 条数据。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
// 参数1: 从什么位置开始
// 参数2: 需要删除多少个元素
arr.splice(1, 1);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
要求删除数组中除了第 0 条以外的所有数据 (删)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script type="text/javascript">
let arr = ["a", "b", "c"];
arr.splice(1, 2);
console.log(arr);
</script>
</head>
<body>
</body>
</html>
