数组常用的方法一-CSDN博客

本文链接：https://blog.csdn.net/CZW2181119177/article/details/119420477

一、数组属性：length：可设置或返回数组中元素的数目。

<body>

<p id="demo">点击按钮创建数组，并显示数组元素个数。</p>

<button onclick="myFunction()">点我</button>

<script>
function myFunction()
{
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x=document.getElementById("demo");
x.innerHTML=fruits.length;
}
</script>

</body>

菜鸟教程演示：https://www.runoob.com/try/try.php?filename=tryjsref_length_array

二、数组的增删改查：push() pop() unshift() shift()

push()：可向数组的末尾添加一个或多个元素，并返回新的长度。

注意： 新元素将添加在数组的末尾。

注意： 此方法改变数组的长度。

<body>

<p id="demo">单击按钮给数组添加新的元素。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.push("Kiwi")
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>

菜鸟教程演示：https://www.runoob.com/try/try.php?filename=tryjsref_push

pop()：用于删除数组的最后一个元素并返回删除的元素。

注意：此方法改变数组的长度！

<body>

<p id="demo">单击按钮删除数组的最后一个元素。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.pop();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>

菜鸟教程演示：https://www.runoob.com/try/try.php?filename=tryjsref_pop

unshift() ：可向数组的开头添加一个或更多元素，并返回新的长度。

注意： 该方法将改变数组的数目。

<body>

<p id="demo">单击按钮在数组中插入元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.unshift("Lemon","Pineapple");
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>
<p><b>注意:</b> unshift()方法不能用于 IE 8 之前的版本，插入的值将被返回成<em> undefined </em>。</p>

</body>

菜鸟教程演示：https://www.runoob.com/try/try.php?filename=tryjsref_unshift

shift() ：用于把数组的第一个元素从其中删除，并返回第一个元素的值。

注意： 此方法改变数组的长度！

<body>

<p id="demo">单击按钮删除数组的第一个元素。</p>
<p id="demo2"></p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	var delell = fruits.shift();
	var x=document.getElementById("demo");
	x.innerHTML= '删除后数组为：' +  fruits;
	document.getElementById("demo2").innerHTML= '删除的元素是：' +  delell;
}
</script>

菜鸟教程演示：https://www.runoob.com/try/try.php?filename=tryjsref_shift