Home > Web Front-end > JS Tutorial > Adding, deleting, modifying, and checking arrays of JavaScript study notes_javascript skills

Adding, deleting, modifying, and checking arrays of JavaScript study notes_javascript skills

WBOY
Release: 2016-05-16 15:09:47
Original
1293 people have browsed it

The importance of arrays in programming languages ​​is self-evident. Arrays in JavaScript are also one of the most commonly used objects. Arrays are ordered collections of values. Due to weak types, arrays in JavaScript are very flexible and powerful. Unlike arrays in strongly typed high-level languages ​​such as Java, which can only store elements of the same type or its subtypes, JavaScript can store multiple types of elements in the same array, and the length can also be dynamically adjusted, as the data increases or Reduce automatic changes to array length.

Array is a common object in JavaScript. It has some classic operations, such as adding, deleting, modifying and checking arrays. This article mainly summarizes the relevant operation methods in this regard.

Add array item

First let’s look at how to add array items to an array. Suppose there is an array:

var arr = [];
Copy after login

The above declares an array, but this array is an empty array [] and its length value is 0. Next we look at how to add array items to the array arr. The simplest way is to add array items to the array through index values:

var arr = [];
arr[0] = 'a';
arr[1] = 'b';
arr[2] = 1;
arr[3] = 2;
console.log(arr); // ["a", "b", 1, 2]
console.log(arr.length); // 4
Copy after login

In addition, you can also add array items to the array by changing the length value of the array, but the array items added to the array in this way are all undefined :

var arr = [];
arr[0] = 'a'; // 给数组arr添加一个`a`数组项
arr.length = 5; // 改变数组的`length`值为`5`
console.log(arr); // ["a", undefined × 4]
Copy after login

Although this method also adds array items to the array, it is relatively troublesome. In fact, adding array items to an array is not so troublesome. You can add array items to an array through the native methods provided by the array.

push()

Use the push() method to add one or more array items to the end of the array.

var arr = [];
arr.push('a','b');
console.log(arr); // ['a','b']
unshift()
Copy after login

Use the push() method to add one or more array items to the end of the array, then use the unshift() method to add one or more array items to the front of the array:

var arr = ['a','b'];
arr.unshift(1,2);
console.log(arr); // [1, 2, "a", "b"]
Copy after login

In addition to these two methods, you can also use the splice() method to add array items to the array:

var arr = ['a','b','c',1,2];
arr.splice(2,0,'d','c','e');
console.log(arr); // ["a", "b", "d", "c", "e", "c", 1, 2]
Copy after login

In addition to the splice() method, you can also use the concat() method to add array items to the array. However, using this method will not change the original array, but will create a new array in the original array:

var arr = ['a','b','c'];
var arr2 = arr.concat('d',1,2,['e',3]);
console.log(arr); // ["a", "b", "c"]
console.log(arr2); // ["a", "b", "c", "d", 1, 2, "e", 3]
Copy after login

Delete array item

For array operations, in addition to adding array items, it is often necessary to delete the array. Commonly used methods to delete array items are pop() and shift().

pop()

The pop() method can remove an array item from the end of the array:

var arr = ['a','b','c','d',1,2];
arr.pop();
console.log(arr); // ["a", "b", "c", "d", 1]
Copy after login

shift()

The shift() method is just the opposite of the pop() method. It can delete the first item of the array:

var arr = ['a','b','c','d',1,2];
arr.shift();
console.log(arr); // ["b", "c", "d", 1, 2]
Copy after login

Whether it is pop() or shift() method, you can only delete one array item from the array at a time, but in many cases, deleting array items in this way is relatively troublesome. In array operations, in addition to these two methods, array items can also be deleted through the slice() and splice() methods.

slice()

The slice() method can delete multiple array items from an array, but the difference is that slice() will not affect the original array, but will only create a copy of the array based on the original array:

var arr = [1,2,3,4,'a','b'];
var arr2 = arr.slice(2);
console.log(arr); // [1, 2, 3, 4, "a", "b"]
console.log(arr2); // [3, 4, "a", "b"]
console.log(arr3); // ["a", "b"]
Copy after login

splice()

In addition to adding array items to an array, the splice() method can also delete array items from an array:

var arr = [1,2,3,4,'a','b','c'];
var arr2 = arr.splice(2,2);
console.log(arr); // [1, 2, "a", "b", "c"]
console.log(arr2); // [3, 4]
Copy after login

Change array

The splice() method in an array is a powerful method in an array. In addition to adding and deleting array items to an array, it can also change an array:

var arr = [1,2,3,4,5,6];
var arr2 = arr.splice(2,3,'a','b','c');
console.log(arr); // [1, 2, "a", "b", "c", 6]
console.log(arr2); // [3, 4, 5]
Copy after login

Array query

The array query mentioned here actually refers to the query extraction of the array. The method used is the slice() method:

var arr = [1,2,3,4,5,6];
var arr2 = arr.slice(-3);
console.log(arr); // [1, 2, 3, 4, 5, 6]
console.log(arr2); // [4, 5, 6]
Copy after login

總結

這裡簡單的整理了一個陣列的增、刪、改、查的相關方法。簡單的總結:

增加數組項方法:除了直接改變數組項的值和修改數組的length 給數組添加數組項方法之外,還可以使用push() 、 unshift() 、 concat() 和splice() 添加數組項

刪除陣列項目方法:刪除陣列項目方法有 pop() 、 shift() 、 slice() 和 splice() 方法

改變數組項方法:在數組中主要透過 splice() 方法來改變數組項

查詢陣列項目方法: 查詢陣列項目方法其實就是對陣列做查詢擷取功能,主要使用的方法是 slice() 方法

有關於 pop() 、 push() 、 shift() 和 unshift() 操作方法可以點擊這裡;關於 concat() 、 slice() 和 splice() 方法的相關介紹可以點擊這裡。

有關JavaScript學習筆記之數組的增、刪、改、查小編就給大家介紹到這裡,希望對大家有所幫助!更多有關javascript知識請登陸腳本之家網站官網了解詳情!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template