07/09/2018, 14:50

Phương thức mảng trong JavaScript

Sức mạnh của mảng JavaScript nằm trong các phương thức mảng. Chuyển đổi mảng sang chuỗi Phương thức JavaScript toString() chuyển đổi một mảng thành một chuỗi các giá trị mảng (bằng dấu phẩy). var fruits = [“Banana”, “Orange”, ...

Sức mạnh của mảng JavaScript nằm trong các phương thức mảng.

Chuyển đổi mảng sang chuỗi

Phương thức JavaScript toString() chuyển đổi một mảng thành một chuỗi các giá trị mảng (bằng dấu phẩy).

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
document.getElementById(“demo”).innerHTML = fruits.toString();

Kết quả hiển thị:

Banana,Orange,Apple,Mango

Phương thức join() cũng nối tất cả các phần tử mảng thành một chuỗi. Nó hoạt động giống như toString(), nhưng ngoài ra bạn có thể chỉ định các dấu phân cách:

var fruits = [“Banana”, “Orange”,”Apple”, “Mango”];
document.getElementById(“demo”).innerHTML = fruits.join(” * “);

Kết quả hiển thị:

Banana * Orange * Apple * Mango

Popping và Pushing

Khi bạn làm việc với các mảng, bạn có thể dễ dàng loại bỏ các phần tử và thêm các phần tử mới. Đây là những gì popping và pushing thực hiện: mở các mục ra khỏi mảng, hoặc đẩy các mục vào một mảng.

Popping

Phương thức pop() loại bỏ phần tử cuối cùng khỏi một mảng:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.pop();              // Removes the last element (“Mango”) from fruits

Phương thức pop() trả về giá trị “popped out”:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
var x = fruits.pop();      // the value of x is “Mango”

Pushing

Phương thức push() thêm một phần tử mới vào một mảng (ở cuối):

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.push(“Kiwi”);       //  Adds a new element (“Kiwi”) to fruits

Phương thức push() trả về chiều dài mảng mới:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
var x = fruits.push(“Kiwi”);   //  the value of x is 5

Chuyển đổi các phần tử

Chuyển đổi tương đương với popping, làm việc trên các yếu tố đầu tiên thay vì cuối cùng. Phương thức shift() loại bỏ phần tử mảng thứ nhất và “dịch chuyển” tất cả các phần tử khác sang một chỉ mục thấp hơn.

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.shift();            // Removes the first element “Banana” from fruits

Phương thức shift() trả về chuỗi đã được “chuyển ra”:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.shift();             // Returns “Banana”

Phương thức unshift() thêm một phần tử mới vào một mảng (ở đầu), và “unshifts” các phần tử cũ hơn:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.unshift(“Lemon”);    // Adds a new element “Lemon” to fruits

Phương thức unshift() trả về độ dài mảng mới.

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.unshift(“Lemon”);    // Returns 5

Thay đổi các phần tử

Các phần tử mảng được truy cập bằng cách sử dụng số chỉ mục của chúng:

Các mảng chỉ số bắt đầu bằng 0. [0] là phần tử mảng đầu tiên, [1] là phần tử thứ hai, [2] là phần tử thứ ba …

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits[0] = “Kiwi”;        // Changes the first element of fruits to “Kiwi”

Thuộc tính length cung cấp một cách dễ dàng để nối thêm một phần tử mới vào một mảng:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits[fruits.length] = “Kiwi”;          // Appends “Kiwi” to fruit

Xóa các phần tử

Vì các mảng JavaScript là các đối tượng, các phần tử có thể bị xóa bằng cách sử dụng toán tử JavaScript delete:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
delete fruits[0];           // Changes the first element in fruits to undefined

Xóa có thể để lại các lỗ không xác định trong mảng đó. Sử dụng pop () hoặc shift () để thay thế.

Ghép nối một mảng

Phương thức splice() có thể được sử dụng để thêm các mục mới vào một mảng:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.splice(2, 0, “Lemon”, “Kiwi”);

Thông số đầu tiên (2) xác định vị trí mà các phần tử mới cần được thêm vào. Tham số thứ hai (0) định nghĩa số lượng các phần tử cần được loại bỏ.

Phần còn lại của các thông số (“Lemon”, “Kiwi”) xác định các yếu tố mới sẽ được thêm vào.

Sử dụng splice() để hủy bỏ phần tử

Với thông số thiết lập thông minh, bạn có thể sử dụng splice() để loại bỏ các phần tử mà không để lại “lỗ hổng” trong mảng:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits.splice(0, 1);        // Removes the first element of fruits

Tham số đầu tiên (0) xác định vị trí mà các phần tử mới nên được thêm vào. Thông số thứ hai (1) xác định số lượng các phần tử cần được loại bỏ.

Phần còn lại của các tham số bị bỏ qua. Không có phần tử mới sẽ được thêm vào.

Kết hợp (kết nối) các mảng

Phương thức concat() tạo ra một mảng mới bằng cách kết hợp (nối) các mảng hiện có:

var myGirls = [“Cecilie”, “Lone”];
var myBoys = [“Emil”, “Tobias”,”Linus”];
var myChildren = myGirls.concat(myBoys);     // Concatenates (joins) myGirls and myBoys

Phương thức concat() không thay đổi mảng hiện tại. Nó luôn luôn trả về một mảng mới.

Phương thức concat() có thể lấy bất kỳ số đối số mảng nào:

var arr1 = [“Cecilie”, “Lone”];
var arr2 = [“Emil”, “Tobias”,”Linus”];
var arr3 = [“Robin”, “Morgan”];
var myChildren = arr1.concat(arr2, arr3);     // Concatenates arr1 with arr2 and arr3

Phương thức concat() cũng có thể lấy các giá trị như các đối số:

var arr1 = [“Cecilie”, “Lone”];
var myChildren = arr1.concat([“Emil”, “Tobias”,”Linus”]);

Ghép nối một mảng

Phương thức slice() lát ra một mảng của một mảng vào một mảng mới. Ví dụ này lát ra một phần của một mảng bắt đầu từ phần tử mảng 1 (“Cam”):

var fruits = [“Banana”, “Orange”, “Lemon”, “Apple”, “Mango”];
var citrus = fruits.slice(1);

Phương thức slice() tạo một mảng mới. Nó không loại bỏ bất kỳ phần tử nào từ mảng gốc. Ví dụ này lát ra một phần của một mảng bắt đầu từ phần tử mảng 3 (“Apple”):

var fruits = [“Banana”, “Orange”, “Lemon”, “Apple”, “Mango”];
var citrus = fruits.slice(3);

Phương thức slice() có thể lấy hai đối số như slice(1, 3). Phương thức sau đó chọn các phần tử từ đối số bắt đầu, và đến (nhưng không bao gồm) đối số kết thúc.

var fruits = [“Banana”, “Orange”, “Lemon”, “Apple”, “Mango”];
var citrus = fruits.slice(1, 3);

Nếu đối số kết thúc bị bỏ qua, như trong ví dụ đầu tiên, phương thức slice() lát ra phần còn lại của mảng.

var fruits = [“Banana”, “Orange”, “Lemon”, “Apple”, “Mango”];
var citrus = fruits.slice(2);

Tự động toString()

JavaScript sẽ tự động chuyển đổi một mảng thành chuỗi tách biệt bằng dấu phẩy khi dự kiến một giá trị nguyên hàm. Đây là trường hợp khi bạn cố gắng để xuất một mảng. Hai ví dụ này sẽ cho kết quả tương tự:

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
document.getElementById(“demo”).innerHTML = fruits.toString();

var fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
document.getElementById(“demo”).innerHTML = fruits;

Tất cả các đối tượng JavaScript có một phương thức toString().

Tìm giá trị Max và Min trong mảng

Không có sẵn chức năng tìm kiếm giá trị cao nhất hoặc thấp nhất trong mảng JavaScript.

Tham khảo thêm các khóa học lập trình web từ Front-end đến Back-end do trực tiếp giảng viên quốc tế trường FPT Arena giảng dạy giúp bạn thành thạo kỹ năng lập trình web từ CƠ BẢN – NÂNG CAO với giá chỉ từ 290,000đ:
  • Học lập trình front-end cơ bản với bootstrap 4/html5/css3
  • Học lập trình front-end nâng cao qua Project thực tế
  • Học thiết kế web với Photoshop, CSS theo kiểu SASS
  • Học cách sử dụng Git_hub cho lập trình viên
  • Học lập trình Back-end PHP theo mô hình MVC cơ bản
  • Học lập trình Back-end PHP theo mô hình MVC nâng cao
  • Học lập trình Cơ sở dữ liệu với AngularJS
  • Học lập trình theme wordpress. Làm ra mọi website hoàn chỉnh với wordpress
  • Combo lập trình front-end từ cơ bản – nâng cao
  • Combo lập trình back-end từ cơ bản đến nâng cao
  • Combo lập trình web với word press từ A-Z
0