Hiểu chuyển đổi loại và ép buộc trong JavaScript

Kiểu gõ động của JavaScript có nghĩa là mã của bạn có thể đơn giản hơn một chút nhưng vẫn có thể mắc lỗi. Để tránh chúng, thật hữu ích khi biết cách JavaScript giải quyết các giá trị với các loại khác nhau để so sánh chúng.

Hiểu chuyển đổi loại và ép buộc trong JavaScript là rất quan trọng để viết các chương trình hiệu quả và đáng tin cậy. Mỗi khái niệm có các trường hợp sử dụng cụ thể và các phương pháp hay nhất có thể ảnh hưởng đến hành vi của mã của bạn.

Tại sao chuyển đổi loại và ép buộc lại xảy ra trong JavaScript?

Ngôn ngữ JavaScript được gõ động. Điều này có nghĩa là, không giống như các ngôn ngữ được nhập tĩnh, JavaScript không yêu cầu bạn xác định rõ ràng loại dữ liệu của một biến trước khi sử dụng nó. Thay vào đó, JavaScript xác định loại trong thời gian chạy tùy thuộc vào giá trị của biến.

Vì các loại dữ liệu không được khai báo rõ ràng cho đến thời gian chạy, nên khi bạn thực hiện các thao tác yêu cầu các loại dữ liệu khác nhau, JavaScript sẽ tự động kiểm tra tính tương thích của chúng với nhau cho thao tác bạn muốn thực hiện. Nếu chúng tương thích với nhau, hoạt động sẽ diễn ra bình thường.

Tuy nhiên, giả sử chúng không tương thích với thao tác—ví dụ: cố gắng thêm một chuỗi và một số. Trong những trường hợp như vậy, JavaScript sẽ tự động “ép buộc” một trong các loại khớp với loại kia để đảm bảo rằng thao tác thành công thay vì đưa ra lỗi. Quá trình này được gọi là ép buộc kiểu hoặc ép buộc ngầm.

loại cưỡng chế

Ép buộc loại là chuyển đổi tự động một giá trị từ loại dữ liệu này sang loại dữ liệu khác, được thực hiện bởi JavaScript trong quá trình chạy chương trình để đảm bảo rằng một thao tác thực hiện thành công.

Nhưng không phải tất cả các loại dữ liệu đều có thể bị ép buộc. Chuỗi, số và boolean là các kiểu dữ liệu JavaScript duy nhất mà ngôn ngữ sẽ ép buộc thành một kiểu khác. Khi bạn cố gắng thực hiện một thao tác không tương thích với các loại dữ liệu mà JavaScript không thể ép buộc, nó sẽ báo lỗi.

JavaScript ép buộc các loại dựa trên loại hoạt động và toán tử bạn sử dụng trong hoạt động.

Ép buộc với toán tử “+”

Trong JavaScript, “+” toán tử có hai hành vi khác nhau tùy thuộc vào loại toán hạng của nó. Nó có thể thực hiện cả phép cộng số và nối chuỗi. Điều này có thể dẫn đến ép kiểu khi một trong các toán hạng không thuộc kiểu mong muốn.

Nếu cả hai toán hạng đều là số, thì “+” toán tử thực hiện phép cộng:

 let num1 = 42;
let num2 = 10;
let sum = num1 + num2; 
console.log(sum); 
 

Nếu cả hai toán hạng đều là chuỗi, thì “+” Toán tử thực hiện nối chuỗi:

 let str1 = "Hello";
let str2 = "world";
let result = str1 + " " + str2; 
console.log(result); 
 

Tuy nhiên, nếu một trong các toán hạng không phải là một chuỗi, JavaScript sẽ ngầm ép nó thành một chuỗi trước khi thực hiện phép nối:

 
let num = 42;
let str = "Hello";

let result_1 = num + str;
console.log(result_1); 

let bool = true;

let result_2 = bool + str;
console.log(result_2); 
 

Ép buộc với toán tử “-”

Trong JavaScript, “–Toán tử ” chủ yếu được sử dụng cho các phép toán trừ. Khi một hoặc cả hai toán hạng trong một hoạt động liên quan đến “–” không phải là một số, JavaScript sẽ cố gắng ép nó thành một số.

Khi cả hai toán hạng đều là số, JavaScript sẽ thực hiện phép trừ. Nó cũng thực hiện phép trừ khi một hoặc cả hai toán hạng là các chuỗi đại diện cho một số:

 const num1 = 10;
const num2 = 20;
const result_1 = num2 - num1; 
console.log(result_1); 
const strNum = "10";
const strNum2 = "20";
const result = strNum2 - strNum; 
console.log(result_1); 
 

Khi cả hai toán hạng đều không phải là một số hoặc một chuỗi đại diện cho một số, JavaScript sẽ cố gắng ép loại dữ liệu thành số tương đương của nó. Nếu kiểu dữ liệu không có số tương đương, phép toán sẽ trả về NaN (Không phải là một con số):

 
const boolNum = true;
const boolNum2 = false;
const result_1 = boolNum - boolNum2;
console.log(result_1); 

const arrNum = [];
const arrNum2 = [];
const result_2 = arrNum - arrNum2;
console.log(result_2); 

const objNum = {};
const result_3 = arrNum - objNum;
console.log(result_3); 
 

Trong ví dụ này, JavaScript ép buộc các giá trị boolean ĐÚNG VẬY Và SAI với các giá trị số tương đương của chúng, 1 Và 0, tương ứng. Các mảng trống bị ép buộc 0, và các đối tượng trống bị ép buộc NaN.

Ép buộc với toán tử bình đẳng (==)/(===)

Trong JavaScript, các toán tử đẳng thức (== Và ===) so sánh các giá trị cho bình đẳng. Tuy nhiên, chúng hoạt động khác nhau do ép buộc kiểu.

Các “==” Toán tử (bình đẳng lỏng lẻo) thực hiện ép buộc kiểu, nghĩa là nó cố gắng chuyển đổi các toán hạng thành cùng kiểu trước khi so sánh:

 "10" == 10; 
 

Trong ví dụ này, JavaScript ép buộc chuỗi “10” thành số 10, vì vậy biểu thức sẽ ước tính thành ĐÚNG VẬY.

Tuy nhiên, “===” Toán tử (bình đẳng nghiêm ngặt) không thực hiện ép kiểu. Nó yêu cầu giá trị và loại giống nhau để so sánh trả về ĐÚNG VẬY:

 "10" === 10; 
 

Trong ví dụ này, phép so sánh trả về SAI bởi vì các toán hạng thuộc các loại khác nhau (chuỗi và số).

Bạn thường nên sử dụng === (bình đẳng nghiêm ngặt) trong JavaScript để tránh hành vi ép buộc loại không mong muốn.

Loại ép buộc hoặc chuyển đổi ngầm định có thể dẫn đến hành vi không mong muốn do tính chất tự động của nó. Trong trường hợp bạn cần chuyển đổi loại, nên chuyển đổi loại rõ ràng. Quá trình chuyển đổi rõ ràng các loại được gọi là chuyển đổi loại. Nó cũng được gọi là ép kiểu và chuyển đổi kiểu rõ ràng.

Chuyển đổi loại

Chuyển đổi kiểu, còn được gọi là truyền kiểu, là quy trình chuyển đổi rõ ràng một giá trị từ kiểu dữ liệu này sang kiểu dữ liệu khác trong JavaScript bằng cách sử dụng các hàm tích hợp sẵn, chẳng hạn như Con số(), Sợi dây(), Boolean(), parseInt()Và parseFloat().

Bạn có thể thực hiện chuyển đổi loại bằng cách chuyển giá trị bạn muốn chuyển đổi vào các hàm chuyển đổi tích hợp làm đối số. Các chức năng này sau đó chuyển đổi giá trị của bạn thành loại bạn muốn.

Đây là một ví dụ sử dụng Con số() chức năng:

 const numStr = "123";
const num = Number(numStr); 
console.log(num); 
 

Truyền một chuỗi là một số hợp lệ làm đối số cho Con số() hàm sẽ trả về một số. Truyền một chuỗi là số không hợp lệ sẽ trả về NaN.

Đây là một ví dụ sử dụng Sợi dây() chức năng:

 const bool = true;
const str2 = String(bool); 
console.log(str2); 
 

Truyền bất kỳ loại dữ liệu nào vào ngoại trừ Biểu tượng vào Sợi dây() chức năng sẽ chuyển đổi kiểu dữ liệu thành một chuỗi.

Đây là một ví dụ sử dụng Boolean() chức năng:

 
const str = "hello";
const bool2 = Boolean(str);
console.log(bool2); 
 

Truyền giá trị trung thực cho Boolean() hàm trả về giá trị boolean “true” trong khi chuyển các giá trị falsy trả về giá trị boolean “false”.

Đây là một ví dụ sử dụng ParseInt() Và ParseFloat() chức năng:

 
const numStr = "123.00";
const num1 = parseInt(numStr);
console.log(num1); 

const floatStr = "3.14";
const num2 = parseFloat(floatStr);
console.log(num2); 
 

Các parseInt() hàm phân tích một đối số chuỗi và trả về một số nguyên. Các parseFloat() hàm chuyển đổi một chuỗi thành một số dấu phẩy động.

Tận dụng kiểu ép buộc và chuyển đổi

Bằng cách hiểu về ép buộc và chuyển đổi kiểu, bạn có thể đưa ra quyết định sáng suốt về thời điểm và cách tận dụng chúng một cách hiệu quả trong mã của mình. Điều quan trọng là đạt được sự cân bằng phù hợp, sử dụng ép buộc kiểu một cách thận trọng để tạo mã ngắn gọn và thuận tiện, đồng thời dựa vào chuyển đổi kiểu rõ ràng để chuyển đổi kiểu có chủ ý và có thể dự đoán được.