Các phương thức chính của mảng

7.1 Phương thức splice()

Mảng trong JavaScript cung cấp các phương thức tích hợp để xử lý dữ liệu. Trong bài giảng này, chúng ta sẽ xem xét bốn phương thức chính của mảng: splice(), slice(), concat() và indexOf(). Mỗi phương thức này thực hiện các thao tác nhất định trên mảng và có thể đơn giản hóa đáng kể việc xử lý dữ liệu.

Phương thức splice() thay đổi nội dung của một mảng bằng cách xóa các phần tử hiện có và/hoặc thêm các phần tử mới vào.

Cú pháp:

    
      
       
   
       
   
       
   
     splice 
   (start, deleteCount, item1, item2, ...);
    
  

Ở đâu:

• start: chỉ số bắt đầu thay đổi
• deleteCount: số lượng phần tử cần xóa. Nếu không được chỉ định, tất cả các phần tử từ vị trí start sẽ bị xóa
• item1, item2, ...: các phần tử được thêm vào mảng. Nếu không chỉ định, không thêm phần tử nào

Ví dụ 1: Xóa phần tử

Trong ví dụ này, hai phần tử từ mảng fruits bị xóa bắt đầu từ chỉ số 2. Giá trị trả về là một mảng chứa các phần tử bị xóa.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let removed = fruits.splice(2, 2);

      console.log(fruits);   // Sẽ in ra: ['apple', 'banana', 'fig']
      console.log(removed);  // Sẽ in ra: ['cherry', 'date']
    
  

Ví dụ 2: Thêm phần tử

Trong ví dụ này, hai phần tử mới (date và fig) được thêm vào mảng fruits bắt đầu từ chỉ số 2. Không có phần tử nào bị xóa.

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(2, 0, 'date', 'fig');

      console.log(fruits);   // Sẽ in ra: ['apple', 'banana', 'date', 'fig', 'cherry']
    
  

Ví dụ 3: Thay thế phần tử

Trong ví dụ này, phần tử ở chỉ số 1 (banana) được thay thế bằng hai phần tử mới (date và fig).

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(1, 1, 'date', 'fig');

      console.log(fruits);   // Sẽ in ra: ['apple', 'date', 'fig', 'cherry']
    
  

7.2 Phương thức slice()

Phương thức slice() trả về một mảng mới chứa bản sao một phần của mảng gốc. Mảng gốc không thay đổi.

Cú pháp:

    
      array.slice(begin, end);
    
  

Ở đâu:

• begin: chỉ số bắt đầu sao chép
• end: chỉ số mà sao chép dừng lại (không bao gồm phần tử với chỉ số này). Nếu không chỉ định, sao chép tất cả các phần tử đến cuối mảng

Ví dụ 1: Sao chép một phần của mảng

Trong ví dụ này, một mảng mới được tạo chứa các phần tử từ chỉ số 1 đến 2 từ mảng fruits.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let sliced = fruits.slice(1, 3);

      console.log(sliced);   // Sẽ in ra: ['banana', 'cherry']
    
  

Ví dụ 2: Sao chép từ đầu mảng

Trong ví dụ này, một mảng mới được tạo chứa các phần tử từ chỉ số 0 và 1 từ mảng fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(0, 2);

      console.log(sliced);   // Sẽ in ra: ['apple', 'banana']
    
  

Ví dụ 3: Sao chép đến cuối mảng

Trong ví dụ này, một mảng mới được tạo chứa các phần tử từ chỉ số 1 đến cuối mảng fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(1);

      console.log(sliced);   // Sẽ in ra: ['banana', 'cherry']
    
  

7.3 Phương thức concat()

Phương thức concat() được sử dụng để kết hợp hai hoặc nhiều mảng. Nó trả về một mảng mới, chứa các phần tử của tất cả các mảng đã kết hợp.

Cú pháp:

    
      array1.concat(array2, array3, ...);
    
  

Ở đâu:

• array1, array2, array3, ...: các mảng cần kết hợp

Ví dụ 1: Kết hợp hai mảng

Trong ví dụ này, các mảng fruits1 và fruits2 được kết hợp thành mảng mới combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let combined = fruits1.concat(fruits2);

      console.log(combined); // Sẽ in ra: ['apple', 'banana', 'cherry', 'date']
    
  

Ví dụ 2: Kết hợp nhiều mảng

Trong ví dụ này, ba mảng được kết hợp thành mảng mới combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let fruits3 = ['fig', 'grape'];
      let combined = fruits1.concat(fruits2, fruits3);

      console.log(combined); // Sẽ in ra: ['apple', 'banana', 'cherry', 'date', 'fig', 'grape']
    
  

Ví dụ 3: Kết hợp mảng với phần tử

Trong ví dụ này, phần tử cherry và date được thêm vào mảng fruits, tạo thành mảng mới moreFruits.

    
      let fruits = ['apple', 'banana'];
      let moreFruits = fruits.concat('cherry', 'date');

      console.log(moreFruits); // Sẽ in ra: ['apple', 'banana', 'cherry', 'date']
    
  

7.4 Phương thức indexOf()

Phương thức indexOf() trả về chỉ số đầu tiên mà phần tử có thể được tìm thấy trong mảng, hoặc -1 nếu không tìm thấy phần tử.

Cú pháp:

    
      array.indexOf(searchElement, fromIndex);
    
  

Ở đâu:

• searchElement: phần tử cần tìm
• fromIndex: chỉ số bắt đầu tìm kiếm. Nếu không chỉ định, tìm kiếm bắt đầu từ đầu mảng

Ví dụ 1: Tìm kiếm phần tử trong mảng

Trong ví dụ này, phương thức indexOf() trả về chỉ số của phần tử banana trong mảng fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('banana');

      console.log(index); // Sẽ in ra: 1
    
  

Ví dụ 2: Không tìm thấy phần tử

Trong ví dụ này, phương thức indexOf() trả về -1, vì phần tử date không tìm thấy trong mảng fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('date');

      console.log(index); // Sẽ in ra: -1
    
  

Ví dụ 3: Tìm kiếm phần tử từ chỉ số nhất định

Trong ví dụ này, phương thức indexOf() bắt đầu tìm kiếm phần tử banana từ chỉ số 2 và tìm thấy nó ở chỉ số 3.

    
      let fruits = ['apple', 'banana', 'cherry', 'banana'];
      let index = fruits.indexOf('banana', 2);

      console.log(index); // Sẽ in ra: 3