Использование общих операций массивов js (push, pop, unshift, shift, splice, concat, join)

внешний интерфейс JavaScript HTML

1. Добавляйте и удаляйте начало или конец массива ( push(), pop(), unshift(), shift() )

Пример 1: Установка длины массива

html

<ul>
	<li>1、设置数组的length</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>默认length</button> &nbsp;<button>取前3个</button></li>
</ul>

js:

var btn = document.getElementsByTagName('button');
btn[0].onclick = function(){
	var arr=[1,2,3,4,5];
	alert(arr) //1,2,3,4,5
}//原数组
btn[1].onclick = function(){
	var arr=[1,2,3,4,5];
	arr.length = 3;
	alert(arr) //1,2,3
}//取前三个

*Пример 2: добавьте **push()* в конец массиваметод для добавления одного или нескольких элементов в конец массива и возврата новой длины Синтаксис: arrayObject.push(новыйэлемент1,новыйэлемент2,....,новыйэлементX)

html:

<ul>
	<li>2、数组尾部添加 push</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>尾部添加</button> &nbsp;</li>
</ul>

js:

btn[2].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.push(6)
	alert(arr) //1,2,3,4,5,6
}//尾部添加一个元素

*Пример 3, удалить конец массива **pop()*метод для удаления и возврата последнего элемента массива Синтаксис: arrayObject.pop()

html:

<ul>
	<li>3、数组尾部删除 pop</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>尾部删除一个</button> &nbsp;</li>	
</ul>

js:

btn[3].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.pop()
	alert(arr) //1,2,3,4
}//尾部删除一个

Пример 4: Добавление заголовка массиваunshift()Метод для добавления одного или нескольких элементов в начало массива и возврата новой длины Синтаксис: arrayObject.unshift(новыйэлемент1,новыйэлемент2,....,новыйэлементX)

html:

<ul>
	<li>4、数组头部添加 unshift</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>头部添加一个</button> &nbsp;</li>	
</ul>

js:

btn[4].onclick= function(){
	var arr = [1,2,3,4,5]
	arr.unshift('w')
	alert(arr) //w,1,2,3,4,5
}//头部添加一个

Пример 5: Удаление заголовка массиваshift()Метод используется для удаления из него первого элемента массива и возврата значения первого элемента Синтаксис: arrayObject.shift()

HTML:

<ul>
	<li>5、数组头部删除 shift</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>头部删除一个</button> &nbsp;</li>
</ul>

js:

btn[5].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.shift()
	alert(arr)//2,3,4,5
}//头部删除一个

**2.Использование удаления, добавления и замены массива Использование splice() ** *Пример 1, удаление массива splice() -- может удалить любое количество элементов, нужно только указать 2 параметра: позицию первого удаляемого элемента и количество удаляемых элементов *Синтаксис: arr.splice(start, length) [например, arr.splice(0,2) удалит первые два элемента в массиве. 】

html:

<ul>
	<li>6、数组添加删除 任意操作 （删除 splice）</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>删除2-4</button> &nbsp;</li>
</ul>

js:

btn[6].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.splice(1,3)//从第一个元素后面，删除三个元素
	alert(arr)//1,5
}//删除2-4

Пример 2: добавление массива splice() -- любое количество элементов может быть вставлено в указанную позицию, необходимо указать только 3 параметра: начальная позиция вставки, 0 (количество элементов для удаления) и элемент, который необходимо удалить. вставлен. Если вы хотите вставить несколько элементов, вы можете передать четвертый, пятый и любое количество элементов. Синтаксис: arr.splice (начальная точка, длина 0, добавляемые элементы) [например, arr.splice(2,0,"a","b") вставит строки "a" и "b" из позиции 2 】

html:

<ul>
	<li>6、数组添加删除 任意操作 （添加 splice）</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>在第二位添加abc</button> &nbsp;</li>	
</ul>

js:

btn[7].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.splice(1,0,'abc')//从第一个元素后面，添加abc元素
	alert(arr)//1,abc,2,3,4,5
}//添加abc

Пример 3: Замена массива splice(), т. е. комплексное приложение для удаления и вставки одного и того же количества элементов, может указывать на указанную позицию для вставки любого количества элементов и одновременного удаления любого количества элементов. нужно указать только 3 заданных параметра: начальную позицию, количество элементов для удаления и любое количество элементов для вставки. Количество вставленных элементов не обязательно равно количеству удаленных элементов.Синтаксис: arr.splice (начальная точка, длина — число, которое нужно заменить, замененный элемент) [например, splice(2,2,"a","b") удалит элемент в позиции 2 текущего массива , а затем начните с позиции 2 Начните вставлять строки «a» и «b». 】 HTML:

<ul>
	<li>6、数组添加删除 任意操作 （替换 splice）</li>
</ul>
<ul>
	<li><span>var arr=[1,2,3,4,5] </span><button>在第二位删除2位又添加2位</button> &nbsp;        </li>
</ul>

js:

btn[8].onclick = function(){
	var arr = [1,2,3,4,5]
	arr.splice(2,2,'a','b')//从第二个元素后面，添加a,b元素
	alert(arr) //1,2,a,b,5
}//在第二位后面删除2位又添加2位

3. Соединение и разделение массива (использование concat() и join())

Пример 1, подключение массиваконкат()Метод используется для объединения двух или более строк. Этот метод не изменяет исходную строку, а возвращает новую строку, объединяющую две или более строк. Синтаксис: string.concat(строка1, строка2, ..., строкаX)HTML:

<ul>
		<li>数组连接 concat</li>
		<li><span>var a=[1,2,3]; var b=[4,5,6] </span><button>连接两个数组</button> &nbsp;</li>
</ul>

js:

btn[9].onclick = function(){
	var a = [1,2,3] 
	var b = [4,5,6]
	var arr = a.concat(b) //concat()方法用于连接两个或多个数组
	alert(arr) //1,2,3,4,5,6
}

*Пример 2, разделение массива **join()*Метод используется для помещения всех элементов массива в строку. Синтаксис: arrayObject.join(разделитель)

html:

<ul>
<li>例2、数组分隔 join</li>
		<li><span>var a=[1,2,3,4,5,6] </span><button>用-连接</button> &nbsp;</li>
</ul>

js:

btn[10].onclick = function(){
	var a = [1,2,3,4,5,6]
	a.join('-')//使用分隔符来分隔数组中的元素
	alert(a.join('-'))//1-2-3-4-5-6
}

Категории