Tổng Hợp Các Hàm Mảng Trong Javascript | Array Functions

JavaScript cung cấp nhiều hàm xử lý mảng để thực hiện các thao tác như thêm, xoá, sắp xếp, lọc, và nhiều tác vụ khác. Dưới đây là một số hàm phổ biến liên quan đến mảng trong JavaScript:

Hàm Cơ Bản:

  1. concat(): Hàm này được sử dụng để kết hợp hai hoặc nhiều mảng thành một mảng mới mà không làm thay đổi mảng gốc.
    var array1 = [1, 2, 3];
    var array2 = [4, 5, 6];
    var newArray = array1.concat(array2); // newArray sẽ là [1, 2, 3, 4, 5, 6]
    
  2. join(): Chuyển đổi tất cả các phần tử của mảng thành một chuỗi, nối chúng với một dấu phân cách được chỉ định (mặc định là dấu phẩy).
    var array = [1, 2, 3];
    var result = array.join('-'); // result sẽ là "1-2-3"
    
  3. pop(): Loại bỏ phần tử cuối cùng của mảng và trả về phần tử đó.
    var array = [1, 2, 3];
    var removedElement = array.pop(); // removedElement sẽ là 3, và array sẽ trở thành [1, 2]
    
  4. push(): Thêm một hoặc nhiều phần tử vào cuối mảng và trả về chiều dài mới của mảng.
    var array = [1, 2, 3];
    var newLength = array.push(4, 5); // newLength sẽ là 5, và array sẽ trở thành [1, 2, 3, 4, 5]
    
  5. reverse(): Đảo ngược thứ tự các phần tử trong mảng.
    var array = [1, 2, 3];
    array.reverse(); // array sẽ trở thành [3, 2, 1]
    
  6. shift(): Loại bỏ phần tử đầu tiên của mảng và trả về phần tử đó.
    var array = [1, 2, 3];
    var removedElement = array.shift(); // removedElement sẽ là 1, và array sẽ trở thành [2, 3]
    
  7. unshift(): Thêm một hoặc nhiều phần tử vào đầu mảng và trả về chiều dài mới của mảng.
    var array = [2, 3];
    var newLength = array.unshift(1); // newLength sẽ là 3, và array sẽ trở thành [1, 2, 3]
    
  8. slice(): Dùng để trích xuất một số phần tử trong mảng js. Trả về một phần của mảng từ vị trí bắt đầu đến vị trí kết thúc mà không làm thay đổi mảng gốc.
    var array = [1, 2, 3, 4, 5];
    var subArray = array.slice(1, 4); // subArray sẽ là [2, 3, 4]
    
  9. splice(): Thay đổi nội dung của mảng bằng cách loại bỏ hoặc thêm phần tử ở các vị trí cụ thể.
    var array = [1, 2, 3, 4, 5];
    array.splice(2, 1, 6); // array sẽ trở thành [1, 2, 6, 4, 5]
    
  10. toString(): Chuyển đổi mảng thành một chuỗi phân cách bằng dấu phẩy.
    var array = [1, 2, 3];
    var arrayString = array.toString(); // arrayString sẽ là "1,2,3"

Hàm Lặp và Truy Cập Phần Tử:

  1. forEach(callback(currentValue, index, array)): Duyệt qua từng phần tử của mảng và gọi một hàm callback cho mỗi phần tử. Không trả về giá trị.
    var array = [1, 2, 3];
    array.forEach(function(item, index) {
        console.log(item); // In ra từng phần tử: 1, 2, 3
    });
    
  2. map(callback(currentValue, index, array)): Tạo một mảng mới bằng cách gọi một hàm callback cho mỗi phần tử của mảng và trả về giá trị mới.
    var array = [1, 2, 3];
    var newArray = array.map(function(item) {
        return item * 2; // newArray sẽ là [2, 4, 6]
    });
    
  3. filter(callback(currentValue, index, array)): Tạo một mảng mới chứa các phần tử thoả mãn một điều kiện được xác định bởi hàm callback.
    var array = [1, 2, 3, 4, 5];
    var newArray = array.filter(function(item) {
        return item > 2; // newArray sẽ là [3, 4, 5]
    });
    
  4. find(callback(currentValue, index, array)): Trả về giá trị của phần tử đầu tiên trong mảng thoả mãn điều kiện được xác định bởi hàm callback.
    var array = [1, 2, 3, 4, 5];
    var result = array.find(function(item) {
        return item > 2; // result sẽ là 3
    });
    
  5. every(callback(currentValue, index, array)): Kiểm tra xem tất cả các phần tử của mảng có thoả mãn điều kiện được xác định bởi hàm callback hay không. Trả về true nếu tất cả đều đúng, ngược lại trả về false.
    var array = [1, 2, 3, 4, 5];
    var allGreaterThanZero = array.every(function(item) {
        return item > 0; // Trả về true vì tất cả đều lớn hơn 0
    });
    
  6. some(callback(currentValue, index, array)): Kiểm tra xem có ít nhất một phần tử trong mảng thoả mãn điều kiện được xác định bởi hàm callback hay không. Trả về true nếu ít nhất một phần tử thoả mãn, ngược lại trả về false.
    var array = [1, 2, 3, 4, 5];
    var someGreaterThanThree = array.some(function(item) {
        return item > 3; // Trả về true vì có ít nhất một phần tử lớn hơn 3
    });
    
  7. indexOf(element): Trả về chỉ số đầu tiên của phần tử trong mảng. Nếu không tìm thấy, trả về -1.
    var array = [1, 2, 3, 4, 5];
    var index = array.indexOf(3); // index sẽ là 2
    
  8. lastIndexOf(element): Trả về chỉ số cuối cùng của phần tử trong mảng. Nếu không tìm thấy, trả về -1.
    var array = [1, 2, 3, 4, 3];
    var lastIndex = array.lastIndexOf(3); // lastIndex sẽ là 4

Hàm Sắp Xếp và So Sánh

  1. sort(compareFunction): Sắp xếp các phần tử của mảng dựa trên giá trị Unicode của các ký tự. Nếu không có hàm so sánh được cung cấp, các phần tử sẽ được chuyển đổi thành chuỗi và sắp xếp theo thứ tự từ điển.
    var array = [3, 1, 4, 1, 5, 9, 2, 6, 5];
    array.sort(); // array sẽ trở thành [1, 1, 2, 3, 4, 5, 5, 6, 9]
    

    Nếu bạn muốn sắp xếp mảng theo một tiêu chí khác, bạn có thể sử dụng hàm so sánh tùy chỉnh (compareFunction).

    var array = [3, 1, 4, 1, 5, 9, 2, 6, 5];
    array.sort(function(a, b) {
        return a - b; // Sắp xếp theo thứ tự tăng dần
    });
    

  2. reverse(): Đảo ngược thứ tự của các phần tử trong mảng.
    var array = [1, 2, 3, 4, 5];
    array.reverse(); // array sẽ trở thành [5, 4, 3, 2, 1]
    
  3. compareFunction(a, b): Là một hàm so sánh tùy chỉnh được sử dụng để xác định cách sắp xếp các phần tử trong mảng. Hàm này trả về một số dương nếu a lớn hơn b, một số âm nếu a nhỏ hơn b, và 0 nếu chúng bằng nhau.
    var array = [3, 1, 4, 1, 5, 9, 2, 6, 5];
    array.sort(function(a, b) {
        return b - a; // Sắp xếp theo thứ tự giảm dần
    });

Hàm Chuyển Đổi Mảng:

  1. toString(): Chuyển đổi mảng thành một chuỗi phân cách bằng dấu phẩy và trả về chuỗi kết quả.
    var array = [1, 2, 3];
    var arrayString = array.toString(); // arrayString sẽ là "1,2,3"
    
  2. toLocaleString(): Tạo một chuỗi đại diện cho mảng bằng cách gọi hàm toLocaleString() cho mỗi phần tử. Hàm này thường được sử dụng để hiển thị mảng theo địa phương (ngôn ngữ và quốc gia) của người dùng.
    var array = [1234567.89, 9876543.21];
    var arrayString = array.toLocaleString(); // arrayString sẽ phụ thuộc vào cài đặt ngôn ngữ và quốc gia, ví dụ: "1,234,567.89, 9,876,543.21" (trong tiếng Anh)
    
  3. join(separator): Chuyển đổi mảng thành một chuỗi bằng cách nối các phần tử với một chuỗi phân cách được chỉ định.
    var array = [1, 2, 3];
    var arrayString = array.join('-'); // arrayString sẽ là "1-2-3"
    

    Mặc định, hàm join() sẽ sử dụng dấu phẩy làm phân cách nếu bạn không cung cấp tham số nào.

    var array = [1, 2, 3];
    var arrayString = array.join(); // arrayString sẽ là "1,2,3"

Hàm Biến Đổi Mảng:

  1. map(callback(currentValue, index, array)): Tạo một mảng mới bằng cách gọi một hàm callback cho mỗi phần tử của mảng và trả về giá trị mới.
    var array = [1, 2, 3];
    var newArray = array.map(function(item) {
        return item * 2; // newArray sẽ là [2, 4, 6]
    }); 
  2. reduce(callback(accumulator, currentValue, index, array), initialValue): Tổng hợp mảng thành một giá trị duy nhất bằng cách thực hiện một hàm callback cho mỗi phần tử của mảng, lưu trữ kết quả trung gian trong biến tích lũy (accumulator).
    var array = [1, 2, 3, 4];
    var sum = array.reduce(function(accumulator, currentValue) {
        return accumulator + currentValue; // sum sẽ là 10
    }, 0);
    

    Nếu không có giá trị khởi tạo (initialValue), giá trị đầu tiên của mảng sẽ được sử dụng làm giá trị khởi tạo cho biến tích lũy.

  3. reduceRight(callback(accumulator, currentValue, index, array), initialValue): Giống như reduce(), nhưng bắt đầu từ phải sang trái (phần tử cuối cùng của mảng).
    var array = [1, 2, 3, 4];
    var reversedSum = array.reduceRight(function(accumulator, currentValue) {
        return accumulator + currentValue; // reversedSum sẽ là 10 (1 + 2 + 3 + 4)
    }, 0);

Hàm Kiểm Tra và Sao Chép:

  1. isArray(value): Kiểm tra xem một giá trị có phải là một mảng hay không và trả về true nếu đúng, ngược lại trả về false.
    var arr = [1, 2, 3];
    var isArrayResult = Array.isArray(arr); // isArrayResult sẽ là true
    
  2. isArrayBuffer(value): Kiểm tra xem một giá trị có phải là một ArrayBuffer hay không và trả về true nếu đúng, ngược lại trả về false.
    var buffer = new ArrayBuffer(16);
    var isArrayBufferResult = ArrayBuffer.isView(buffer); // isArrayBufferResult sẽ là true
    
  3. includes(searchElement, fromIndex): Kiểm tra xem một mảng có chứa một phần tử cụ thể hay không. Trả về true nếu phần tử được tìm thấy, ngược lại trả về false. Bắt đầu tìm kiếm từ vị trí chỉ định bởi fromIndex.
    var array = [1, 2, 3, 4, 5];
    var includesResult = array.includes(3); // includesResult sẽ là true
    
  4. indexOf(searchElement, fromIndex): Trả về chỉ số đầu tiên của phần tử được tìm thấy trong mảng. Nếu không tìm thấy, trả về -1. Bắt đầu tìm kiếm từ vị trí chỉ định bởi fromIndex.
    var array = [1, 2, 3, 4, 5];
    var indexOfResult = array.indexOf(3); // indexOfResult sẽ là 2
    

    Nếu fromIndex là một số âm, tìm kiếm sẽ bắt đầu từ cuối mảng.

Hàm Lọc và Xoá Phần Tử:

  1. filter(callback(currentValue, index, array)): Tạo một mảng mới chứa các phần tử thoả mãn một điều kiện được xác định bởi hàm callback.
    var array = [1, 2, 3, 4, 5];
    var newArray = array.filter(function(item) {
        return item > 2; // newArray sẽ là [3, 4, 5]
    });
    
  2. splice(start, deleteCount, item1, item2, ...): Thay đổi nội dung của mảng bằng cách loại bỏ hoặc thêm phần tử ở các vị trí cụ thể.
    var array = [1, 2, 3, 4, 5];
    array.splice(2, 1, 6); // Xoá 1 phần tử từ vị trí 2 và thêm phần tử 6, array sẽ trở thành [1, 2, 6, 4, 5]
    
    • start: Vị trí bắt đầu thay đổi mảng.
    • deleteCount: Số lượng phần tử cần xoá từ vị trí start.
    • item1, item2, ...: Các phần tử cần thêm vào mảng từ vị trí start.
  3. pop(): Loại bỏ phần tử cuối cùng của mảng và trả về phần tử đó.
    var array = [1, 2, 3];
    var removedElement = array.pop(); // removedElement sẽ là 3, và array sẽ trở thành [1, 2]
    
  4. shift(): Loại bỏ phần tử đầu tiên của mảng và trả về phần tử đó.
    var array = [1, 2, 3];
    var removedElement = array.shift(); // removedElement sẽ là 1, và array sẽ trở thành [2, 3]
    

Hàm filter() thường được sử dụng để tạo mảng mới chỉ chứa các phần tử thoả mãn một điều kiện nào đó. Hàm splice(), pop(), và shift() được sử dụng để thay đổi cấu trúc của mảng bằng cách xoá hoặc thêm phần tử.

Hàm Thao Tác Mảng:

  1. concat(array1, array2, ...): Tạo một mảng mới bằng cách kết hợp các mảng hoặc giá trị vào mảng hiện tại.
    var array1 = [1, 2, 3];
    var array2 = [4, 5, 6];
    var newArray = array1.concat(array2); // newArray sẽ là [1, 2, 3, 4, 5, 6]
    
  2. slice(start, end): Trả về một phần của mảng từ vị trí bắt đầu đến vị trí kết thúc mà không làm thay đổi mảng gốc.
    var array = [1, 2, 3, 4, 5];
    var subArray = array.slice(1, 4); // subArray sẽ là [2, 3, 4]
    
    • start: Vị trí bắt đầu cắt mảng.
    • end: Vị trí kết thúc cắt mảng (không bao gồm).
  3. splice(start, deleteCount, item1, item2, ...): Thay đổi nội dung của mảng bằng cách loại bỏ hoặc thêm phần tử ở các vị trí cụ thể.
    var array = [1, 2, 3, 4, 5];
    array.splice(2, 1, 6); // Xoá 1 phần tử từ vị trí 2 và thêm phần tử 6, array sẽ trở thành [1, 2, 6, 4, 5]
    
    • start: Vị trí bắt đầu thay đổi mảng.
    • deleteCount: Số lượng phần tử cần xoá từ vị trí start.
    • item1, item2, ...: Các phần tử cần thêm vào mảng từ vị trí start.
  4. copyWithin(target, start, end): Sao chép các phần tử từ vị trí bắt đầu đến vị trí kết thúc và chèn chúng vào mảng từ vị trí target, mà không làm thay đổi chiều dài của mảng.
    var array = [1, 2, 3, 4, 5];
    array.copyWithin(0, 3, 5); // Sao chép từ vị trí 3 đến 5 và chèn vào vị trí 0, array sẽ trở thành [4, 5, 3, 4, 5]
    
    • target: Vị trí đích để chép các phần tử đến.
    • start: Vị trí bắt đầu chép.
    • end: Vị trí kết thúc chép (không bao gồm).

Hàm concat() được sử dụng để kết hợp mảng, slice() để tạo một bản sao của mảng hoặc trích xuất một phần, splice() để thay đổi nội dung của mảng bằng cách xoá hoặc thêm phần tử, và copyWithin() để sao chép và chèn các phần tử trong mảng.

Hàm Thông Tin Mảng:

  1. length: Thuộc tính này trả về số lượng phần tử trong mảng. Đây là một thuộc tính chỉ đọc, nghĩa là bạn không thể gán giá trị mới cho nó để thay đổi kích thước của mảng.
    var array = [1, 2, 3, 4, 5];
    var arrayLength = array.length; // arrayLength sẽ là 5
    
  2. indexOf(element, fromIndex): Trả về chỉ số đầu tiên của phần tử được tìm thấy trong mảng. Nếu không tìm thấy, trả về -1. Bắt đầu tìm kiếm từ vị trí chỉ định bởi fromIndex.
    var array = [1, 2, 3, 4, 3];
    var indexOfResult = array.indexOf(3); // indexOfResult sẽ là 2
    

    Nếu fromIndex là một số âm, tìm kiếm sẽ bắt đầu từ cuối mảng.

  3. lastIndexOf(element, fromIndex): Trả về chỉ số cuối cùng của phần tử được tìm thấy trong mảng. Nếu không tìm thấy, trả về -1. Bắt đầu tìm kiếm từ vị trí chỉ định bởi fromIndex.
    var array = [1, 2, 3, 4, 3];
    var lastIndexOfResult = array.lastIndexOf(3); // lastIndexOfResult sẽ là 4
    

    Nếu fromIndex là một số âm, tìm kiếm sẽ bắt đầu từ cuối mảng.

Các hàm indexOf()lastIndexOf() thường được sử dụng để kiểm tra xem một phần tử có tồn tại trong mảng hay không và để xác định vị trí của nó.

Hàm So Sánh Mảng:

  1. every(callback(currentValue, index, array)): Kiểm tra xem tất cả các phần tử của mảng có thoả mãn điều kiện được xác định bởi hàm callback hay không. Trả về true nếu tất cả đều đúng, ngược lại trả về false.
    var array = [1, 2, 3, 4, 5];
    var allGreaterThanZero = array.every(function(item) {
        return item > 0; // Trả về true vì tất cả đều lớn hơn 0
    });
    
  2. some(callback(currentValue, index, array)): Kiểm tra xem có ít nhất một phần tử trong mảng thoả mãn điều kiện được xác định bởi hàm callback hay không. Trả về true nếu ít nhất một phần tử thoả mãn, ngược lại trả về false.
    var array = [1, 2, 3, 4, 5];
    var someGreaterThanThree = array.some(function(item) {
        return item > 3; // Trả về true vì có ít nhất một phần tử lớn hơn 3
    });

Hàm Chuyển Đổi Và Nối Mảng:

  1. concat(array1, array2, ...): Tạo một mảng mới bằng cách kết hợp các mảng hoặc giá trị vào mảng hiện tại.
    var array1 = [1, 2, 3];
    var array2 = [4, 5, 6];
    var newArray = array1.concat(array2); // newArray sẽ là [1, 2, 3, 4, 5, 6]
    
  2. join(separator): Chuyển đổi tất cả các phần tử của mảng thành một chuỗi, nối chúng với một dấu phân cách được chỉ định (mặc định là dấu phẩy).
    var array = [1, 2, 3];
    var result = array.join('-'); // result sẽ là "1-2-3"
    
  3. slice(start, end): Trả về một phần của mảng từ vị trí bắt đầu đến vị trí kết thúc mà không làm thay đổi mảng gốc.
    var array = [1, 2, 3, 4, 5];
    var subArray = array.slice(1, 4); // subArray sẽ là [2, 3, 4]
    

Hàm every()some() được sử dụng để kiểm tra điều kiện trên tất cả hoặc một số phần tử của mảng. Hàm concat() được sử dụng để kết hợp mảng. Hàm join() chuyển đổi mảng thành chuỗi với dấu phân cách tùy chỉnh. Hàm slice() tạo một bản sao của mảng hoặc trích xuất một phần của nó.

Hàm Iteration Mảng (Lặp qua mảng):

  1. forEach(callback(currentValue, index, array)): Duyệt qua từng phần tử của mảng và gọi một hàm callback cho mỗi phần tử. Không trả về giá trị.
    var array = [1, 2, 3];
    array.forEach(function(item, index) {
        console.log(item); // In ra từng phần tử: 1, 2, 3
    });
    
  2. entries(): Trả về một đối tượng iterator chứa cặp key/value cho mỗi phần tử trong mảng.
    var array = ['a', 'b', 'c'];
    var iterator = array.entries();
    
    for (let entry of iterator) {
        console.log(entry); // In ra mỗi cặp key/value: [0, 'a'], [1, 'b'], [2, 'c']
    }
    
  3. keys(): Trả về một đối tượng iterator chứa các chỉ số (key) của mỗi phần tử trong mảng.
    var array = ['a', 'b', 'c'];
    var iterator = array.keys();
    
    for (let key of iterator) {
        console.log(key); // In ra mỗi chỉ số: 0, 1, 2
    }
    
  4. values(): Trả về một đối tượng iterator chứa các giá trị của mỗi phần tử trong mảng.
    var array = ['a', 'b', 'c'];
    var iterator = array.values();
    
    for (let value of iterator) {
        console.log(value); // In ra mỗi giá trị: 'a', 'b', 'c'
    }
    

Hàm forEach() được sử dụng để thực hiện một hành động cho mỗi phần tử trong mảng. Các hàm entries(), keys(), và values() trả về các iterator cho phép bạn duyệt qua cặp key/value, chỉ số, và giá trị của mảng, tương ứng. Các iterator này thường được sử dụng trong các vòng lặp for...of.

Nhận xét

Mới hơn Cũ hơn