JavaScript: Mảng (Array)

Đăng ký nhận thông tin về những video mới nhất

Việc sử dụng những biến để tàng trữ những giá trị gặp phải 1 số ít hạn chế như sau :

  • Mỗi biến chỉ có thể chứa một giá trị duy nhất. Điều này có nghĩa là để lưu trữ n giá trị trong một chương trình, sẽ cần n khai báo biến. Do đó, việc sử dụng các biến là không khả thi khi người ta cần lưu trữ một lượng lớn các dữ liệu.

    Bạn đang đọc: JavaScript: Mảng (Array)

  • Các biến trong một chương trình được cấp phép bộ nhớ theo thứ tự ngẫu nhiên, do đó gây khó khăn vất vả cho việc truy xuất / đọc những giá trị theo thứ tự khai báo của chúng .

JavaScript ra mắt khái niệm mảng ( array ) để xử lý được những hạn chế nêu trên .
Một mảng là một tập hợp những giá trị giống hệt, gồm có một tập hợp những giá trị có cùng kiểu tài liệu, và do người dùng định nghĩa .

Các tính năng của một mảng

  • Một khai báo mảng sẽ phân chia những vùng nhớ một cách tuần tự, không phải ngầu nhiên, vậy nên thuận tiện quản trị .
  • Mảng là tĩnh. Điều này có nghĩa là một mảng một khi được khởi tạo không hề đổi khác size .
  • Mỗi vùng nhớ đại diện thay mặt cho một thành phần mảng .
  • Môi thành phần mảng được xác lập bởi một số ít nguyên duy nhất được gọi là chỉ số / chỉ mục của thành phần .
  • Mảng giống như những biến, cần được khai báo trước khi chúng được sử dụng .
  • Khởi tạo mảng đề cập đến việc khởi tạo giá trị cho những thành phần mảng .
  • Giá trị thành phần mảng hoàn toàn có thể được update hoặc sửa đổi nhưng không hề xóa .

Khai báo và khởi tạo mảng

Để khai báo và khởi tạo một mảng trong JavaScript, hãy sử dụng cú pháp sau :

var tên_mảng; //khai báo
tên_mảng = [val1,val2,...,valn] //khởi tạo các phần tử mảng
Hoặc:
var tên_mảng = [val1,val2…valn]

Lưu ý : Cặp [ ] được gọi là thứ nguyên của mảng .

Ví dụ: var numArr = [1,3,5,7] sẽ tạo ra một mảng như trong hình dưới đây.

Khởi tạo mảng

Truy cập phần tử mảng

Cách truy vấn một thành phần mảng : Tên mảng theo sau là cặp ngoặc vuông, bên trong là chỉ số của thành phần mảng .

tên_mảng[chỉ_số]

Ví dụ đơn thuần :

var num = [1,3,2,5,4]
console.log(num[0] ) ; 
console.log(num[1] ) ;

Output :

1 
3

Đối tượng mảng

Một mảng cũng có thể được tạo bằng cách sử dụng đối tượng Array. Hàm tạo Array có thể được truyền vào như:

  • Một giá trị số đại diện thay mặt cho size của mảng .
  • Một list những giá trị được phân tách bằng dấu phẩy .

Các ví dụ sau đây tạo ra một mảng bằng chiêu thức này .

Thí dụ về đối tượng mảng

Ví dụ 1 :

var arr = new Array(4)
for(var i = 0;i

Output :

0 
2 
4 
6 

Ví dụ 2 : Hàm tạo Array được cho phép những giá trị được phân tách bằng dấu phẩy

var arr = new Array(" JavaScript "," PHP "," Laravel "," Vue. js ")
for(var i = 0;i

Output :

JavaScript
PHP
Laravel
Vue.js

Phương thức của mảng

Sau đây là list những phương pháp của đối tượng người tiêu dùng Array cùng với miêu tả của chúng .

concat()

Trả về một mảng mới sau khi nối 2 mảng với nhau .
Ví dụ :

var a = [' a ', ' b ', ' c '] ;
var b = [1, 2, 3] ;
var con = b.concat(a) ;
console.log(con) ; / /1,2,3,a,b,c

every()

Trả về true nếu mọi thành phần trong mảng này thỏa mãn nhu cầu tính năng kiểm tra được phân phối .
Ví dụ :

function check(x) {
   return (x > = 10) ;
}
var result = [12, 5, 8, 130, 44] .every(check) ;
console.log(result) ; / / false

filter()

Lọc những thành phần có giá trị theo điều kiện kèm theo .
Ví dụ :

function filt(element) { 
   return (element > = 10) ; / / Lọc những thành phần > = 10
} 
var passed = [12, 5, 8, 130, 44] .filter(filt) ; 
console.log(" Result : " + passed ) ; / /Result : 12,130,44

forEach()

Gọi một hàm cho mỗi thành phần trong mảng .
Ví dụ :

var arr = new Array(12,13,14,15)
console.log(" In mảng gốc ...... ")
arr.forEach(function(val,index) {
   console.log(val)
} )
arr.reverse( ) / / đảo ngược mảng
console.log(" In mảng sau khi đảo ngược .... ")
arr.forEach(function(val,index) {
   console.log(val)
} )

Output :

In mảng gốc...... 
12 
13 
14 
15 
In mảng sau khi đảo ngược.... 
15 
14 
13 
12

indexOf()

Trả về chỉ số ( nhỏ nhất ) tiên phong của một thành phần trong mảng ứng với giá trị được chỉ định hoặc - 1 nếu không tìm thấy .
Ví dụ :

var in = [12, 5, 8, 130, 44, 8] .indexOf(8) ; 
console.log(" Kết quả : " + in) / / Kết quả : 2

join()

Nối toàn bộ những thành phần của một mảng thành một chuỗi .
Ví dụ :

var arr = new Array(" PHP "," Laravel "," Vue. js ") ;
var str = arr.join(" - ") ;console.log(str) ; / / PHP-Laravel-Vue. js

lastIndexOf()

Trả về chỉ mục ở đầu cuối ( lớn nhất ) của một thành phần trong mảng ứng với giá trị được chỉ định hoặc - 1 nếu không tìm thấy .
Ví dụ :

var in = [12, 5, 8, 130, 44, 8] .lastIndexOf(8) ; 
console.log(" Kết quả : " + in) / / Kết quả : 5

map()

Tạo một mảng mới với tác dụng là lời gọi một hàm được phân phối trên mỗi thành phần trong mảng này .
Ví dụ :

var arr = [1, 4, 9] ;
var newArr = arr.map(Math.sqrt) ;
console.log(" Result : " + newArr ) ; / / Result : 1,2,3

pop()

Loại bỏ thành phần sau cuối khỏi mảng và trả về thành phần đó .
Ví dụ :

var arr = [1, 3, 2, 5, 4];
console.log(" Kết quả : " + arr) / / Kết quả : 1,3,2,5

push()

Thêm một hoặc nhiều thành phần vào cuối mảng và trả về độ dài mới của mảng .
Ví dụ :

var arr = [1, 3, 2, 5, 4];
arr.push( 7,6 ) ;
console.log(" Kết quả : " + arr) / / Kết quả : 1,3,2,5,4,7,6

reduce()

Áp dụng đồng thời một hàm so với hai giá trị của mảng ( từ trái sang phải ) để giảm nó thành một giá trị .
Ví dụ :

var sum = [0, 1, 2, 3] .reduce(function(x, y) {return x + y;} ) ; 
console.log(" Sum : " + total ) ; / / Sum : 6

reduceRight()

Áp dụng đồng thời một hàm so với hai giá trị của mảng ( từ phải sang trái ) để giảm nó thành một giá trị .
Ví dụ :

var sum = [0, 1, 2, 3] .reduceRight(function(x, y) {return x + y;} ) ; 
console.log(" Sum : " + total ) ; / / Sum : 6

reverse()

Đảo ngược thứ tự những thành phần của mảng - thành phần tiên phong trở thành thành phần sau cuối, thành phần ở đầu cuối trở thành thành phần tiên phong, ...
Ví dụ :

var arr = [0, 1, 2, 3, 4, 5] .reverse( ) ; 
console.log(" Mảng sau khi đảo ngược : " + arr) ; / / Mảng sau khi đảo ngược : 5,4,3,2,1,0

shift()

Loại bỏ thành phần tiên phong khỏi mảng và trả về thành phần đó .
Ví dụ :

var arr = [1, 2, 3, 4, 5] .shift( ) ; 
console.log(arr) ; / / 1

slice()

Trích xuất một phần của mảng và trả về một mảng mới .
Ví dụ :

var arr = [

"PHP"

, " Laravel ", " Vue. js ", " Node. js ", " React. js "] ; console.log(arr.slice(0, 2)) ; / / PHP, Laravel console.log(arr.slice(1, 3)) ; / / Laravel, Vue. js

some()

Trả về true nếu có tối thiểu một thành phần trong mảng thỏa mãn nhu cầu hàm kiểm tra .
Ví dụ :

function check(element) { 
   return (element > = 10) ; 
} 
var result1 = [21, 1, 2, 3, 5, 8] .some(check) ; 
console.log(result1) ; / / false 

var result2 = [1, 1, 2, 3, 5, 8, 13] .some(check) ; 
console.log(result) ; / / true

toSource ( )
Hiển thị mã nguồn của đối tượng người dùng .

sort()

Sắp xếp những thành phần của một mảng theo trật tự tăng dần theo bảng mã ASCII .

splice()

Thêm và / hoặc vô hiệu những thành phần từ mảng .
Cú pháp :

array.splice(index, nums, [ele1][, ..., eleN]);

index là chỉ số nơi bắt đầu thao tác, nums là số lượng phần tử muốn thao tác, [ele1][, ..., eleN] là các phần tử cụ thể muốn thao tác (có thể không có).

Ví dụ :

var arr = [" PHP ", " Laravel ", " Vue. js ", " Node. js ", " React. js "] ;
arr.splice(1, 0, " Angular ") ; / / thêm Angular vào vị trí có chỉ số 1 ( thành phần thứ 2 )
console.log(arr) ; / / PHP, Angular, Laravel, Vue. js, Node. js, React. js
arr.splice(1, 2, " Angular ") ; / / xóa 2 thành phần mở màn từ chỉ số 1, rồi thêm Angular vào vị trí có chỉ số 1
console.log(arr) ; / / PHP, Angular, Node. js, React. js
arr.splice(1, 2) ; / / xóa 2 thành phần khởi đầu từ chỉ số 1
console.log(arr) ; / / PHP, Node. js, React. js

toString()

Trả về một chuỗi hiển thị những thành phần của mảng .
Ví dụ :

var arr = new Array(" đỏ ", " da cam ", " vàng ", " lục ") ;
var str = arr.toString( ) ;
console.log(str) ; / / đỏ, da cam, vàng, lục

unshift()

Thêm một hoặc nhiều thành phần vào phía trước của mảng và trả về độ dài mới của mảng .
Ví dụ :

var arr = [" PHP ", " Laravel ", Vue.js", " Node. js ", " React. js "] ;
var len = arr.unshift(JavaScript") ; 
console.log(arr) ; / / JavaScript, PHP, Laravel, Vue. js, Node. js, React. js 
console.log(len) ; / / 6

Phương thức của mảng trong ES6

Sau đây là một số ít phương pháp mảng mới được ra mắt trong ES6 .

find()

find ( ) được cho phép bạn lặp qua một mảng và lấy lại thành phần tiên phong tương thích .
Ví dụ

var arr = [1, 2, 3] ; 
var firstOdd = arr.find( (x) => x % 2 = = 1) ; 
console.log( firstOdd) ; / / 1

findIndex()

findIndex ( ) hoạt động giải trí tương tự như như find ( ), nhưng thay vì trả về thành phần tìm được, nó trả về chỉ mục của thành phần đó .

var numbers = [4, 6, 3, 5] ;
var oddNumber = numbers.findIndex( (x) => x % 2 = = 1) ;
console.log(oddNumber) ; / / 2

entries()

Trả về một bộ lặp mảng hoàn toàn có thể được sử dụng để lặp qua những khóa và giá trị của mảng và sẽ trả về một mảng những mảng, trong đó mỗi mảng con là một mảng dạng [ index, value ]. Ví dụ :

var arr = [2, 4, 6] ; 
var val = arr.entries( ) ; 
console.log(val.next( ) .value) ;  
console.log(val.next( ) .value) ;  
console.log(val.next( ) .value) ;

Output :

[0,2] 
[1,4] 
[2,6]

Ngoài ra, chúng ta cũng có thể sử dụng toán tử spread để lấy một mảng các mục trong một lần.

var numbers = [1, 2, 3]; 
var val= numbers.entries(); 
console.log([...val]);

Output :

[[0,1],[1,2],[2,3]]

from()

Array.from() cho phép tạo mảng mới từ đối tượng mảng. Chức năng cơ bản của from() là chuyển đổi hai loại giá trị sau thành mảng:

  • Giá trị giống như mảng .
  • Các giá trị hoàn toàn có thể lặp như Set và Map .

Ví dụ

" use strict " 
for (let x of Array.from(' V1Study ') ) {
   console.log(x)
}

Output :

V                               
1                               
S                               
t                               
u
d
y

keys()

Hàm này trả về những chỉ mục của mảng .
Ví dụ

console.log(Array.from( [' x ', ' y ', ' z '] .keys( ) ) )

Đầu ra sau đây được hiển thị khi triển khai thành công xuất sắc mã trên .

[ 0, 1, 2 ] 

Array Traversal sử dụng cho vòng lặp for...in

Ta hoàn toàn có thể sử dụng vòng lặp for ... in để duyệt qua một mảng .

" use strict " 
var nums = [1001,1002,1003,1004] 
for(let j in nums) { 
   console.log(nums[j] ) 
}

Output :

1001 
1002 
1003 
1004

Mảng trong JavaScript

JavaScript tương hỗ những khái niệm sau về mảng :

Mảng đa chiều

JavaScript tương hỗ những mảng đa chiều. Dạng đơn thuần nhất của mảng đa chiều là mảng hai chiều .
Cú pháp khai báo :

var arrName = [ [val1,val2,val3,...],[v1,v2,v3,...] ]

Truy cập thành phần mảng :
arrName [ chỉ_số_hàng ] [ chỉ_số_cột ]
Ví dụ :

var arr = [ [1,2,3], [7,8,9] ]  
console.log(arr[0] [0] ) 
console.log(arr[0] [1] ) 
console.log(arr[0] [2] ) 
console.log(arr[1] [0] ) 
console.log(arr[1] [1] ) 
console.log(arr[1] [2] )

Output :

1
2
3
7
8
9

Truyền mảng cho hàm

Ta hoàn toàn có thể truyền cho hàm một con trỏ tới một mảng bằng cách chỉ định tên của mảng mà không có chỉ mục .
Ví dụ :

var arr = new Array(" PHP "," Laravel "," Vue. js "," React. js ") 
function func(ar) {
   for(var i = 0;i

Output :

PHP
Laravel
Vue.js
React.js

Trả về mảng từ các hàm

JavaScript được cho phép một hàm trả về một mảng .
Ví dụ :

function func( ) { 
   return new Array(HTML5",CSS3",JavaScript",SQL") 
} 
var arr = func( ) 
for(var i in arr) { 
   console.log(arr[i] ) ;
}

Output :

HTML5
CSS3
JavaScript
SQL

Khử cấu trúc mảng

JavaScript tương hỗ khử cấu trúc trong ngữ cảnh của một mảng .
Ví dụ

var arr = [" Laravel "," Vue. js "] 
var[a,b] = arr
console.log(a)
console

.

log(b)

Output :

Laravel
Vue.js