Chính xác thì “==” làm gì?
Trong JavaScript, toán tử “==” là toán tử so sánh. Điều này có nghĩa là bạn có thể thực hiện các bài kiểm tra logic để xem liệu một thứ có bằng một thứ khác không. Kết quả sẽ luôn trả về true hoặc false
Với “==”, JavaScript không quan tâm bạn chuyển loại dữ liệu nào [chuỗi hay số nguyên] miễn là nội dung mà bạn cung cấp cho nó phù hợp
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]3
“===” khác với “==” như thế nào?
Toán tử “===” so sánh cả nội dung và loại , whereas “==” compares only content. JavaScript counts anything that is in between the two quotation marks as a chuỗi . Trước đó tôi đã đề cập rằng chúng ta sẽ sử dụng các số “55” và 55, ngoại trừ, “55” không phải là số nguyên, nó là một chuỗi, trong khi 55 là số nguyên because it is not encapsulated by quotation marks.
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]4
Ví dụ: điều này có nghĩa là nếu bạn có các số 55 và “55” và thử so sánh chúng với toán tử “===” thì nó sẽ không chỉ so sánh nội dung của hai dữ liệu hoặc biến mà bạn chuyển đến . Trong trường hợp này, nó sẽ trả về false, vì một chuỗi không cùng kiểu dữ liệu với một số nguyên. typeof variable or data it is. In this case, it would return false, because a string is not the same data type as an integer.
Làm thế nào tôi có thể so sánh == vs. === của riêng tôi?
Trả lời. Tìm hiểu Công cụ dành cho nhà phát triển của Chrome. DevTools [còn được gọi là Trình kiểm tra web] là người bạn tốt nhất của nhà phát triển web. Chúng cho phép bạn chỉnh sửa bất kỳ trang web cục bộ nào trong thời gian thực. Và chúng cho phép bạn sử dụng tính năng bảng điều khiển của chúng để thực hiện kiểm tra logic, viết các hàm đơn giản và hơn thế nữa. Hãy xem Hướng dẫn DevTools của Chrome này nếu bạn muốn tìm hiểu thêm.
Cách tốt nhất để kiểm tra == vs. === bằng JavaScript
- Mở DevTools bằng cách nhấn xuống Command+Shift+I [Mac] hoặc bằng cách nhấp chuột phải vào bất kỳ đâu trên màn hình và chọn “Kiểm tra”.
- Nhấp vào tab “bảng điều khiển”. Từ đó, bạn sẽ có thể thực hiện các bài kiểm tra logic bằng JavaScript. Nhập “55” === 55 và bạn sẽ thấy kết quả trả về false. And yet, when you pass “55” == 55 thì kết quả là true. Huyền diệu.
Bạn thậm chí có thể kiểm tra JavaScript của mình chỉ bằng cách sử dụng các biến. Chỉ cần xóa bảng điều khiển của bạn bằng cách nhấp chuột phải, sau đó nhấn “Xóa bảng điều khiển”, sau đó dùng thử
Vậy còn. = toán tử và. ==?
Bạn cũng có thể so sánh nếu một cái gì đó là “. =” [không bằng] cái gì khác, và nếu cái gì đó là “. ==” [hoàn toàn không bằng] cái gì khác
Khi kiểm tra nếu “55”. == 55 với. ==, câu trả lời trả về sẽ đúng vì chuỗi “55” không hoàn toàn bằng số nguyên 55.
Hãy chắc chắn tìm hiểu về bảng điều khiển bằng cách sử dụng các loại dữ liệu khác nhau cho đến khi bạn hiểu nó một cách khoa học, nếu bạn vẫn còn bối rối thì hãy nhớ xem Các toán tử so sánh của Mozilla< . Sau đó, khi bạn đã sẵn sàng, hãy tận dụng những siêu năng lực mới học được của bạn về tính trung thực của JavaScript để tham gia các cuộc đua trong page which goes into further detail. Then when you are ready, take your newly learned superpowers of JavaScript truthiness to the races in the Trò chơi trên bàn bình đẳng JavaScript.
Suy nghĩ cuối cùng
Cảm ơn bạn đã dành thời gian đọc một chút về toán tử và toán hạng trong JavaScript. Nếu bạn là người mới bắt đầu hoặc người đã biết một số điều cơ bản và muốn tìm hiểu thêm về ngôn ngữ JavaScript, hãy nhớ xem Một tháng
Trong JavaScript, sự khác biệt giữa toán tử == và toán tử === là cách so sánh được thực hiện
- Toán tử == kiểm tra xem hai giá trị có bằng nhau hay không mà không cần quan tâm đến kiểu dữ liệu của chúng
- Toán tử === kiểm tra xem hai giá trị có bằng nhau hay không nếu chúng có cùng kiểu dữ liệu
Một cách tuyệt vời để thấy điều này là so sánh một số và một chuỗi đại diện cho cùng một số
console.log["1" == 1] // true console.log["1" === 1] // false
- So sánh đầu tiên cho kết quả đúng vì toán tử == chuyển đổi chuỗi “1” thành một số và so sánh nó với số 1
- So sánh thứ hai trả về false vì bạn cố gắng so sánh một chuỗi với một số, điều này vô nghĩa
Hóa ra, toán tử == chuyển đổi các so sánh thành một loại phổ biến trước khi thực hiện so sánh
Một từ ưa thích cho việc chuyển đổi là ép buộc kiểu ngầm định
Trước khi tìm hiểu chi tiết về == và === trong JavaScript, hãy thảo luận ngắn gọn về ép buộc kiểu ẩn
Trong hướng dẫn này, bạn học
- Kiểu ép buộc [ngầm và rõ ràng] là gì
- Sự khác biệt giữa các toán tử == và ===
- Các toán tử so sánh == và === hoạt động như thế nào với
- kiểu nguyên thủy [chuỗi, số, booleans]
- các loại tham chiếu [mảng và các bộ sưu tập khác]
Loại ép buộc trong JavaScript
Trong JavaScript, ép kiểu đề cập đến việc thay đổi kiểu dữ liệu
Chẳng hạn, chuyển đổi một chuỗi thành một số là kiểu ép buộc
Trong JavaScript, kiểu ép buộc chỉ có thể được sử dụng để biến các giá trị thành
- Chuỗi
- Con số
- Boolean
Bạn không thể ép buộc một đối tượng theo bất kỳ loại nào khác, chẳng hạn như chức năng hoặc đối tượng
Trong JavaScript, kiểu ép buộc có thể là kiểu
- ép kiểu ngầm định
- ép buộc kiểu rõ ràng
Hãy dành một chút thời gian để hiểu ý nghĩa của chúng
Ép buộc loại rõ ràng
Ép buộc kiểu rõ ràng, như tên cho thấy, có nghĩa là thực hiện ép buộc kiểu rõ ràng
Theo thuật ngữ của giáo dân, điều này có nghĩa là chuyển đổi thủ công loại giá trị
Thông thường, điều này có nghĩa là sử dụng hàm tích hợp sẵn, chẳng hạn như String[], Number[] hoặc Boolean[]
Chẳng hạn, hãy chuyển đổi một chuỗi thành một số và thêm một số khác vào chuỗi đó
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]
đầu ra
110
Nếu bạn không chuyển đổi chuỗi thành một số, bạn sẽ không thể tính tổng nó bằng một số khác
Bây giờ, hãy nói về ép buộc kiểu ẩn, nghĩa là ép buộc kiểu tự động diễn ra dưới mui xe
Ép buộc kiểu ẩn
Trong JavaScript, ép buộc kiểu ẩn có nghĩa là một giá trị được tự động chuyển đổi từ kiểu dữ liệu này sang kiểu dữ liệu khác
Từ ẩn ý đề cập đến nó xảy ra dưới mui xe
Ép buộc kiểu ẩn chỉ diễn ra nếu bạn cố gắng thực hiện một thao tác trên hai toán hạng thuộc các kiểu khác nhau
Chẳng hạn, nếu bạn so sánh hai giá trị của một loại khác nhau, thì kiểu ép buộc ẩn sẽ chuyển đổi các giá trị thành kiểu Số. Sau đó, nó so sánh các giá trị số
Dưới đây là một số ví dụ
"1" == 1 // 1 == 1 --> true true == "true" // true == NaN --> false "0" == false // 0 == 0 --> true
Bây giờ bạn đã hiểu cách hoạt động của tính năng ép kiểu ẩn trong JavaScript
Điều này cũng cho bạn một cái nhìn thoáng qua về cách toán tử == so sánh các giá trị trong JavaScript
Tiếp theo, hãy nói về toán tử ==
Toán tử bình đẳng lỏng lẻo [==]
Trong JavaScript, toán tử bằng lỏng [==] so sánh lỏng lẻo hai giá trị
Nếu bạn so sánh hai giá trị của các loại dữ liệu khác nhau, thì toán tử == ngầm ép cả hai giá trị thành số
Do đó, một toán tử đẳng thức lỏng lẻo có thể trả về true ngay cả khi các loại giá trị được so sánh không khớp
Ví dụ
"1" == 1 // true true == "true" // false "0" == false // true
Nhưng điều này đôi khi có thể là vấn đề
Thay vì so sánh lỏng lẻo các giá trị, bạn sẽ có thể thực hiện so sánh chặt chẽ hơn để đảm bảo các giá trị cùng loại trước khi so sánh
Đây là lúc toán tử đẳng thức nghiêm ngặt [===] xuất hiện
Toán tử bình đẳng nghiêm ngặt [===]
Toán tử đẳng thức nghiêm ngặt [===] không hoàn toàn ép buộc các giá trị được so sánh
Theo thuật ngữ của giáo dân, nó không chuyển đổi các phần tử được so sánh thành cùng một kiểu dữ liệu
Do đó, nếu các giá trị được so sánh đại diện cho các loại dữ liệu khác nhau, phép so sánh nghiêm ngặt sẽ tự động trả về giá trị sai
Vì vậy, một chuỗi không thể hoàn toàn bằng một số, ví dụ
Dưới đây là một số ví dụ
"1" === 1 // false true === "true" // false "0" === false // false 2 === 2 // true "A" === "A" // true
Hãy đến với phần thú vị. Sự khác biệt giữa == và === trong JavaScript là gì?
== so với === trong JavaScript
Với tất cả những gì bạn đã học cho đến nay, việc hiểu sự khác biệt giữa == và === trở nên tầm thường
- Toán tử đẳng thức lỏng lẻo == sử dụng ép buộc kiểu ẩn để chuyển đổi các phép so sánh thành một kiểu chung nếu cần
- Toán tử đẳng thức nghiêm ngặt === so sánh trực tiếp các giá trị và không chuyển đổi chúng thành một kiểu dữ liệu chung
Do đó, nếu bạn cố gắng so sánh các giá trị thuộc loại khác nhau, toán tử == có thể trả về giá trị true, nhưng toán tử === thì không thể
Đến thời điểm này, bạn đã thấy các ví dụ với số, chuỗi và booleans
Các kiểu dữ liệu này thuộc về một nhóm được gọi là kiểu nguyên thủy trong JavaScript
Tuy nhiên, có một nhóm kiểu dữ liệu hoàn toàn khác trong JavaScript được gọi là kiểu tham chiếu [hoặc đối tượng], chẳng hạn như mảng
So sánh các loại tham chiếu với các toán tử == và === có một ý nghĩa khác, điều quan trọng là phải hiểu
So sánh các loại tham chiếu với các loại nguyên thủy
Trong JavaScript, các kiểu dữ liệu là kiểu nguyên thủy hoặc kiểu tham chiếu
Ví dụ về các kiểu nguyên thủy là số, chuỗi và booleans
Ví dụ về các loại tham chiếu là mảng, hàm và các bộ sưu tập khác
Chúng ta hãy xem cách các toán tử so sánh hoạt động với cả kiểu nguyên thủy và kiểu tham chiếu chi tiết hơn
Các loại nguyên thủy
Các loại nguyên thủy của JavaScript là
- Boolean
- Con số
- Chuỗi
- Biểu tượng
- Chưa xác định
- Vô giá trị
- BigInt
Tất cả các kiểu nguyên thủy xác định giá trị bất biến
Nói cách khác, bạn không thể trực tiếp thay đổi giá trị của các kiểu nguyên thủy. Thay vào đó, bạn cần tạo một kiểu nguyên thủy mới
Hãy chứng minh tính bất biến bằng một ví dụ đơn giản
let a = 1 a = 2
Trong đoạn mã này, bạn thực sự không trực tiếp thay đổi đối tượng số từ 1 thành 2
Thay vào đó, bạn tạo một đối tượng Số hoàn toàn mới và đặt biến tham chiếu cho nó
Số nguyên bản còn nguyên. Thay vào đó, một số mới được tạo raSo sánh với các loại nguyên thủy
Bây giờ, hãy quay lại với các toán tử so sánh == và ===
Như bạn đã biết, có sự khác biệt giữa các toán tử == và === khi so sánh các kiểu nguyên thủy
- Toán tử == so sánh lỏng lẻo các giá trị bằng cách chuyển đổi chúng thành một loại chung
- Toán tử === không chuyển đổi các đối tượng được so sánh. Thay vào đó, nó kiểm tra xem cả hai giá trị được so sánh có cùng loại và giá trị của chúng có bằng nhau không
Khi so sánh các đối tượng kiểu tham chiếu, các toán tử so sánh có một ý nghĩa hoàn toàn khác
Mặc dù vậy, sự khác biệt giữa các toán tử == và === vẫn còn
Các loại tài liệu tham khảo
Trong JavaScript, các đối tượng là tập hợp các thuộc tính có thể thay đổi không có kích thước cố định
Đối tượng JavaScript còn được gọi là kiểu tham chiếu
Loại tham chiếu có nghĩa là các đối tượng được truyền bằng tham chiếu trong mã
Ví dụ về các loại tham chiếu là mảng, hàm và các loại bộ sưu tập khác
Để minh họa các kiểu tham chiếu, hãy tạo một mảng, sao chép nó vào một biến mới và thay đổi mảng ban đầu
let a = [1, 2, 3] let b = a a[0] = 1000 console.log[a] // [ 1000, 2, 3 ] console.log[b] // [ 1000, 2, 3 ]
Như bạn có thể thấy, việc thay đổi phần tử đầu tiên trong mảng ban đầu a cũng ảnh hưởng đến mảng “được sao chép” b
Điều này là do
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]2 không thực sự tạo một bản sao của mảng. Thay vào đó, nó tạo một tham chiếu mới đến mảng ban đầu
Logic tương tự này áp dụng cho tất cả các đối tượng JavaScript khác lưu trữ các bộ sưu tập thuộc tính
So sánh với các loại tham chiếu
Với các kiểu tham chiếu, các toán tử so sánh [== và ===] kiểm tra xem hai đối tượng có tham chiếu cùng một đối tượng không
Nói cách khác, bạn có thể sử dụng các toán tử so sánh để kiểm tra xem hai đối tượng có trỏ đến cùng một địa chỉ trong bộ nhớ không
Để tôi chỉ cho bạn một ví dụ minh họa
let a = [1, 2, 3] let b = [1, 2, 3] let c = a console.log[a === b] // false console.log[a === c] // true
Bạn có thể thấy
- a === b trả về false. Điều này là do a và b là các đối tượng khác nhau trong bộ nhớ mặc dù chúng trông giống hệt nhau
- a === c trả về true. Điều này là do a và c trỏ đến cùng một đối tượng trong bộ nhớ
Đây là một minh họa đằng sau hậu trường của điều trên
Các mảng a và c tham chiếu cùng một đoạn bộ nhớ. Điều này xảy ra vì dòng mã này
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]0
Như bạn đã biết, thay vì sao chép, đoạn mã này tạo một tham chiếu mới gọi là c trỏ đến mảng ban đầu a
Điều này thực sự quan trọng để hiểu, nhưng nó không được nói đến thường xuyên
Chẳng hạn, điều này giải thích tại sao bạn không thể kiểm tra xem hai mảng có các phần tử bằng nhau hay không bằng cách sử dụng toán tử == hoặc ===. Để làm điều này, bạn cần lặp qua từng phần tử của mảng
Sự khác biệt giữa toán tử == và === trong các kiểu tham chiếu cũng giống như trong các kiểu nguyên thủy
- Toán tử == chuyển đổi các mục được so sánh thành một kiểu dữ liệu chung. Nếu bạn cố gắng so sánh một kiểu tham chiếu với một kiểu nguyên thủy, thì kiểu ép buộc sẽ cố chuyển đổi tham chiếu thành một kiểu nguyên thủy
- Toán tử === hoàn toàn không sử dụng kiểu ép buộc. Nếu hai giá trị được so sánh đều không phải là kiểu tham chiếu, nó sẽ tự động trả về false
Bây giờ bạn không chỉ hiểu sự khác biệt giữa == và === là gì mà còn biết cách các toán tử so sánh hoạt động khác nhau trong các ngữ cảnh khác nhau
Cuối cùng nhưng không kém phần quan trọng, hãy trả lời câu hỏi bạn nên sử dụng toán tử so sánh nào
Tôi nên sử dụng toán tử so sánh nào. == hay ===?
câu trả lời ngắn. Luôn sử dụng toán tử ba bằng === để so sánh trong JavaScript
Toán tử == cố gắng thực hiện ép buộc kiểu, điều này có thể dẫn đến hành vi lạ trong mã của bạn
Dưới đây là một số ví dụ về một số so sánh với == tạo ra kết quả không mong muốn
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]0
Nhưng khi so sánh với === thì tất cả những so sánh này đều cho kết quả hợp lý và có thể đoán trước được
const numstr = "100" // Convert the string to number [explicit type coercion] const num = Number[numstr] console.log[num + 10]1
Để đảm bảo an toàn, hãy sử dụng toán tử === để so sánh
Phần kết luận
Hôm nay bạn đã học được sự khác biệt giữa toán tử == và === trong JavaScript là gì
Tóm lại
Để hiểu cách thức hoạt động của toán tử ==, bạn cần hiểu thế nào là ép buộc kiểu ngầm định
Ép buộc kiểu ẩn có nghĩa là trình phân tích cú pháp JavaScript tự động chuyển đổi hai giá trị thành một kiểu chung để thực hiện thao tác trên chúng
Ví dụ: để thêm một chuỗi vào một số, số đó cần được chuyển đổi thành chuỗi hoặc chuỗi thành số
Với thông tin này, bạn có thể dễ dàng hiểu được sự khác biệt giữa toán tử == và === trong JavaScript là gì
- Toán tử == chuyển đổi hai phép so sánh thành một kiểu chung trước khi so sánh. Bằng cách này, ví dụ một chuỗi có thể bằng một số
- Toán tử === không thực hiện ép kiểu. Nó kiểm tra xem cả giá trị và loại so sánh có bằng nhau không
Ngoài ra, điều quan trọng là phải hiểu rằng các toán tử so sánh == và === hoạt động hoàn toàn khác với các kiểu tham chiếu, chẳng hạn như mảng. Thay vì so sánh xem các phần tử có bằng nhau hay không, toán tử kiểm tra xem hai đối tượng có tham chiếu cùng một đối tượng trong bộ nhớ không
Cố gắng sử dụng toán tử === càng nhiều càng tốt. Bằng cách này, bạn có thể tránh được "sự bất thường" liên quan đến việc sử dụng toán tử ==