Toán tử so sánh trong JavaScript (P2. So sánh bằng) | Laptrinhcanban.com

Toán tử so sánh trong JavaScript (P2. So sánh bằng)

Hướng dẫn cách sử dụng toán tử so sánh trong JavaScript. Ở phần 2 này bạn sẽ học được các phép so sánh bằng trong JavaScript được biểu diễn thông qua 4 loại toán tử so sánh bằng trong JavaScript sau bài học này.

Toán tử so sánh bằng trong JavaScript

Toán tử so sánh bằng trong JavaScript, là các toán tử được đặt giữa 2 hạng tử và kiểm tra xem chúng bằng nhau hay là khác nhau trong JavaScript.

Để thực hiện các phép so sánh bằng trong JavaScript, chúng ta sử dụng 4 loại toán tử so sánh bằng trong JavaScript được liệt kê trong bảng dưới đây:

Toán tửBiểu thức điều kiệnÝ nghĩa
==x == yx bằng y
!=x != yx không bằng y
===x === yx nghiêm ngặt bằng y
!==x !== yx nghiêm ngặt không bằng y

Ngoài các toán tử so sánh bằng này, chúng ta cũng sử dụng tới 4 loại toán tử so sánh lớn nhỏ mà Kiyoshi đã giới thiệu trong bài Toán tử so sánh trong JavaScript (P1: so sánh lớn nhỏ).

Phép so sánh bằng trong JavaScript sẽ kết hợp toán tử so sánh bằng cùng với hai giá trị ở hai vế trái phải thành một biểu thức điều kiện, sau đó kiểm tra biểu thức điều kiện này là đúng hay sai và đưa ra kết quả. Kết quả của các phép so sánh trong JavaScript sẽ là kiểu boolean trong JavaScript với hai giá trị là True (đúng) hoặc False (sai), và phép toán so sánh trong JavaScript được sử dụng để cấu tạo biểu thức điều kiện được sử dụng trong câu lệnh if trong JavaScript.

Toán tử so sánh bằng trong JavaScript

Toán tử == trong JavaScript

Khi đặt toán tử == trong JavaScript giữa 2 hạng tử, nếu chúng giống nhau thì kết quả true được trả về. Nếu kiểu của 2 hạng tử khác nhau thì chúng sẽ được chuyển về cùng một kiểu dữ liẹu trước khi được so sánh. Và nếu 2 hạng tử này thuộc kiểu object trong JavaScript, nếu chúng cùng tham chiếu tới một object thì được coi là bằng nhau và kết quả true được trả về.

toán tử != thì sẽ có tác dụng ngược lại hoàn toàn với toán tử == trong JavaScript.

So sánh == cùng kiểu dữ liệu

Khi sử dụng toán tử ==, nếu 2 hạng tử có cùng kiểu dữ liệu thì giá trị true sẽ được trả về nếu chúng giống nhau.

console.log(10 == 10);
// true
console.log(10 == 8);
// false
console.log('Apple' == 'Apple');
// true
console.log('Apple' == 'apple');
// false
console.log(true == true);
// true
console.log(true == false);
// false
console.log(null == null);
// true
console.log(undefined == undefined);
// true

Lưu ý duy nhất là khi so sánh NaN với NaN thì kết quả trả về luôn là false.

console.log(NaN == NaN);
// false

So sánh == khác kiểu dữ liệu

Khi sử dụng toán tử ==, nếu 2 hạng tử khác kiểu dữ liệu thì chúng sẽ được chuyển về cùng kiểu dữ liệu trước khi được so sánh.

Ví dụ chúng ta so sánh chuỗi với số bằng toán tử ==, chuỗi đó sẽ được chuyển về kiểu số trước khi được so sánh như sau:

console.log(10 == '10');
// true

console.log(10 == '8');
// false

console.log(10 == 'Apple');
// false

Tương tự thì khi chúng ta so sánh số với một object thì object đó sẽ được chuyển về kiểu số trước khi được so sánh như sau:

console.log(10 == [10]);
// true
console.log(10 == [10, 20]);
// false
console.log(10 == ['10']);
// true
console.log(10 == {num:'10'});
// false
console.log(10 == new Number(10));
// true

Lại nữa, trong JavaScript cũng có một số kiểu dữ liệu không thuộc kiểu chuỗi nhưng có thể được chuyển về dạng số như sau đây:

true       1
false      0
null       0
undefined  NaN

Do vậy, khi so sánh chúng với số trong JavaScript, kết quả phép so sánh sẽ phụ thuộc vào kết quả chuyển kiểu dữ liệu về số của chúng.

console.log(1 == true);
// true
console.log(0 == false);
// true
console.log(1 == false);
// false
console.log('1' == true);
// true
console.log('true' == true);
// false
console.log(null == undefined);
// true

console.log(null == 0);
// false

console.log(null == 1);
// false

So sánh == với object trong javascript

Khi so sánh object trong javascript bằng toán tử ==, chỉ trong trường hợp chúng cùng tham chiếu đến một object thì kết quả true mới được trả về.

Ví dụ cụ thể:

let obj1 = {red:'1', blue:'2'};
let obj2 = {red:'1', blue:'2'};
let obj3,obj4;

obj3 = obj1;

obj4 = obj1;

console.log(obj1 == obj2);
// false

console.log(obj1 == obj3);
// true

console.log(obj4 == obj3);
// true

Có thể thấy rõ mặc dù obj1 và obj2 có nội dung hoàn toàn giống nhau, nhưng khi so sánh chúng với toán từ == thì giá trị false lại được trả về. Và chỉ có các cặp obj1-objc3 và obj4-objc3 do cùng tham chiếu tới object1 nên mới bằng nhau và trả về giá trị true mà thôi.

Toán tử === trong JavaScript

Trong phép so sánh nghiêm ngặt với toán tử === trong JavaScript, nếu 2 hạng tử đem so sánh có cùng kiểu và cùng giá trị thì true sẽ được trả về. Nếu 2 hạng tử khác kiểu dữ liệu, chúng không được chuyển về cùng kiểu mà kết quả phép so sánh sẽ luôn trả về false. Và nếu đem so sánh 2 object với nhau, chỉ khi chúng cùng tham chiếu tới một object thì kết quả sẽ trả về true mà thôi.

toán tử !== thì sẽ có tác dụng ngược lại hoàn toàn với toán tử === trong JavaScript.

So sánh === cùng kiểu dữ liệu

Khi sử dụng toán tử ===, nếu 2 hạng tử có cùng kiểu dữ liệu thì giá trị true sẽ được trả về nếu chúng giống nhau.

console.log(10 === 10);
// true
console.log(10 === 8);
// false
console.log('Apple' === 'Apple');
// true
console.log('Apple' === 'apple');
// false
console.log(true === true);
// true
console.log(true === false);
// false
console.log(null === null);
// true
console.log(undefined === undefined);
// true

Lưu ý duy nhất là khi so sánh NaN với NaN thì kết quả trả về luôn là false.

console.log(NaN === NaN);
// false

So sánh === khác kiểu dữ liệu

Khi sử dụng toán tử ===, nếu 2 hạng tử khác kiểu dữ liệu kết quả false sẽ luôn được trả về.

Ví dụ:

console.log(10 === '10');
// false
console.log(1 === true);
// false
console.log(0 === false);
// false
console.log(null === undefined);
// false
console.log(null === 0);
// false
console.log(10 === [10]);
// false
console.log(10 === new Number(10));
// fals

So sánh === với object trong JavaScript

Khi so sánh object trong JavaScript bằng toán tử ===, chỉ trong trường hợp chúng cùng tham chiếu đến một object thì kết quả true mới được trả về.

Ví dụ cụ thể:

let obj1 = {red:'1', blue:'2'};
let obj2 = {red:'1', blue:'2'};
let obj3,obj4;

obj3 = obj1;

obj4 = obj1;

console.log(obj1 === obj2);
// false

console.log(obj1 === obj3);
// true

console.log(obj4 === obj3);
// true

Có thể thấy rõ mặc dù obj1 và obj2 có nội dung hoàn toàn giống nhau, nhưng khi so sánh chúng với toán từ === thì giá trị false lại được trả về. Và chỉ có các cặp obj1-objc3 và obj4-objc3 do cùng tham chiếu tới object1 nên mới bằng nhau và trả về giá trị true mà thôi.

Sự khác biệt giữa === và == trong JavaScript

Qua các phân tích trên, chúng ta có thể thấy sự khác biệt giữa === và == trong JavaScript thể hiện rõ trong trường hợp chúng ta cần so sánh các giá trị thuộc kiểu dữ liệu khác nhau trong JavaScript.

  1. Khi so sánh các giá trị thuộc kiểu dữ liệu khác nhau trong JavaScript bằng toán tử ==, các giá trị này sẽ được chuyển về cùng một kiểu dữ liệu rồi mới đem so sánh. Và kết quả phép so sánh sẽ hoàn toàn phụ thuộc vào giá trị được chuyển kiểu của chúng.

  2. Ngược lại khi so sánh các giá trị thuộc kiểu dữ liệu khác nhau trong JavaScript bằng toán tử ===, chúng không được chuyển về cùng kiểu dữ liệu, và phép so sánh sẽ luôn trả về kết quả true.

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về cách sử dụng các phép so sánh trong JavaScript được biểu diễn thông qua các toán tử so sánh bằng trong JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

Hãy chia sẻ và cùng lan tỏa kiến thức lập trình Nhật Bản tại Việt Nam!

HOME>> >>

Profile
きよしです!笑

Tác giả : Kiyoshi (Chis Thanh)

Kiyoshi là một cựu du học sinh tại Nhật Bản. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.