Arrays là tính năng ngôn ngữ lập trình dược sử dụng vô cùng rộng rãi; là các biến đặc biệt dùng để lưu trữ nhiều giá trị cùng một lúc. Tuy nhiên, với JavaScript, arrays tuy dễ học, nhưng việc khám phá chuyên sâu không hề dễ dàng.
Trong bài viết, ta sẽ bàn về ba tính năng ít được biết đến, nhưng cũng không kém phần quan trọng của JavaScript arrays.
1. Thêm Custom Properties vào Arrays
Nếu lên mạng lùng sục định nghĩa JavaScript arrays, bạn sẽ thấy rằng hầu như mọi nguồn chính xác sẽ trình bày array thực sự là object.
Trong thực tế, hầu như mọi thứ ta phải xử lý trong JavaScript chung quy lại sẽ thường là object. Có hai Kiểu dữ liệu trong Javascript, primitives và objects, nhưng primitives luôn luôn được gói trong objects.
Array, Function, Date,… là objects Javascript đã xác định có built-in methods, properties và cấu trúc đã chuẩn hóa riêng.
JavaScript arrays có thể có đến ba kiểu properties:
- Indices of an array cũng là properties
- Built-in properties
- Custom properties bạn có thể tự thêm vào
Hai properties đầu tiên được biết đến nhiều hơn, bạn có lẽ đang sử dụng chúng hằng ngày,…
Indices as Properties
JavaScript luôn sử dụng squarec bracket syntax (cú pháp ngoặc vuông), như var ary = ["orange","apple","lychee"];.
Về cơ bản, Indices của nhân tố array là properties mà property names luôn là non-negative integers.
Cặp index-element của một array khá giống với Cặp key-value của một object.
Indice là một tính năng độc đáo của Array object. Và không như những built-in properties khác, indice có thể được set chỉ với cấu trúc ngoặc như ary[3] = "peach";.
Built-in Properties
Arrays cũng có built-in properties, như array.length. Property length có chứa giá trị integer, giá trị này biểu thị độ dài của một array.
Nhìn chung, built-in properties thường được tìm thấy trong các JavaScript objects đã xác định như arrays. Cùng với built-in methods, chúng giúp tùy chỉnh generic objects sao cho objects này phù hợp với các nhu cầu khác nhau.
Ta có thể truy cập built-in properties với cú pháp object.key hay object["key"]. Tương tự, ary["length"] cũng có thể được dùng để truy cập độ dài array.
Tạo Custom Properties cho Array Object
Arrays là objects đã xác định, lưu trữ các kiểu giá trị khác nhau, tại các indices khác nhau.
Thông thường, ta ít khi có nhu cần phải thêm custom properties vào array; đây cũng là một trong những lý do “ma mới” không biết đến tính năng này. Trong thực tế, nếu bạn muốn xem một array như object thông thường bằng cách thêm cặp key-value, bạn chỉ việc chuyển sang dùng object thường luôn cho rồi. Nhưng vẫn có một số trường hợp đặc biệt, bạn có thể tận dụng lợi thế object của array, bằng cách thêm một hoặc nhiều custom properties vào đó.
Ví dụ, bạn có thể thêm custom property vào array giúp xác định “kiểu” hoặc “class” của element (thành tố) đó, như trường hợp dưới đây.
|
1
2
3
4
5
6
7
|
var ary = [ "orange" , "apple" , "lychee" ] ;
ary . itemClass = "fruits" ;
console . log ( ary + " are " + ary . itemClass ) ;
// "orange,apple,lychee are fruits"
|
Nên nhớ, custom property bạn thêm vào array là đếm được. Nói các khác, vòng lặp có thể dùng custom property như trong statement for…in.
2. Loop through Array Elements
“Lặp qua các elements của array” nghe có vẻ trừu tượng, trong thực tế, chúng ta đang thực tự lặp qua indices của array.
Vì array indices được cấu thành chỉ từ non-negative integers, chúng ta sẽ iterate một giá trị integer bắt đầu từ zero và kết thúc tại độ dài lớn nhất của array, sau đó sử dụng giá trị đã iterate đó để truy cập nhân tố array tại index cụ thể.
Tuy nhiên, từ ECMAScript6 trở về sau, ta đã có phương pháp lặp trực tiếp qua các giá trị array mà không cần quan tâm tới indices, và có thể thực hiện với vòng lặp for…of.
Trong một array, vòng lặp for...of sẽ lặp qua các array elements theo thứ tự của indices. Nói cách khác vòng lặp for...of sẽ iterate qua indices và xuất giá trị array đã có tại một index đã cho trước. Đây là vòng lặp lý tưởng nếu bạn chỉ muốn lặp qua và làm việc luôn với tất cả array elements.
|
1
2
3
4
5
6
7
8
|
var ary = [ "orange" , "apple" , "lychee" ] ;
for ( let item of ary ) {
console . log ( item ) ;
}
// "orange", "apple", "lychee"
|
Để thấy rõ hơn, với vòng lặp for thông thường, ta nhận out put là indices thay cho values.
|
1
2
3
4
5
6
7
8
|
var ary = [ "orange" , "apple" , "lychee" ] ;
for ( var item = 0 ; item < ary . length ; item ++ ) {
console . log ( item ) ;
}
// 0, 1, 2
|
3. Độ dài không phải là số Elements
Thông thường, khi ta nói về độ dài của một array, chúng ta hay nghĩ là số giá trị của array đó, hoặc độ dài ta đã gán thủ công cho array. Tuy vậy, trong thực tế, độ dài của một array dựa vào index hiện có lớn nhất trong array.
Độ dài là một property rất linh hoạt. Dù đã cố định trước độ dài của array hay chưa, nếu bạn tiếp tục thêm giá trị vào array, độ dài của array sẽ tiếp tục gia tăng.
|
1
2
3
4
5
6
7
8
9
10
|
var ary = [ ] ;
ary . length = 3 ;
console . log ( ary . length ) ;
// 3
ary [ 5 ] = "abcd" ;
console . log ( ary . length ) ;
// 6
|
Ở ví dụ trên, bạn có thể thấy rằng tôi chỉ gán một giá trị cho array tại index 5, và độ dài biến thành 6. Đến đây, hãy chú ý, sẽ không có bất cứ indices từ 0 đến 4 nào trong array đó. Bạn có thể kểm tra thử bằng operator in.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
var ary = [ ] ;
ary . length = 3 ;
console . log ( ary . length ) ;
// 3
ary [ 5 ] = "abcd" ;
console . log ( ary . length ) ;
// 6
console . log ( 0 in ary ) ;
// false
|
Array ary là một ví dụ của “sparse” array (array mà indices không được tạo liên tục, mà có khoảng cách). Trái với “sparse” array là dense” array (array mà indices tồn tại liên tục trong array, và số element giống như length.
Length property cũng có thể cắt ngắn array, để đảm bảo index cao nhất trong array luôn thấp hơn chính nó, vì theo mặc định length luôn lớn hơn (về số lượng) index cao nhất.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
var ary = [ ] ;
ary . length = 3 ;
console . log ( ary . length ) ;
// 3
ary [ 5 ] = "abcd" ;
console . log ( ary . length ) ;
// 6
ary . length = 2 ;
console . log ( ary . length ) ;
// 2
console . log ( ary [ 5 ] ) ;
// undefined
|
( hongkiat)
Có thể bạn chưa biết:
TUYỂN THỰC TẬP REACT NATIVE
* Trang bị kỹ năng về JS, lập trình hybrid app, sử dụng những công cụ hỗ trợ (VScode, github, sourcetree, ...)
* Thành quả mong muốn là các bạn tham gia sẽ có được kỹ năng lập trình hybrid app
Biểu mẫu đăng ký training tại đây >> http://bit.ly/2NK9YWd
TEAM MOBILE APPS - CTY DVMS
