详解JavaScript运算符中==和===的区别

 更新时间:2023年05月23日 08:20:44   作者:摸鱼王胖嘟嘟  
在JavaScript中==运算符和===运算符是经常遇到的,那么二者有哪些区别呢,本文就来和大家进行简单的讨论,感兴趣的小伙伴可以跟随小编一起学习学习

前言

简单的来讲:

== 代表的是相等

=== 代表的是严格相等

==运算符

==,两边值类型不同的时候,要先进行类型转换,再比较

如果两个都是数值||字符串||布尔值,直接进行比较

console.log(1 == 1); // true
console.log(1 == 2); // false
console.log('a' == 'a'); // true
console.log('a' == 'b'); // false
console.log(true == true); // true
console.log(true == false); // false

如果一个是String类型,另一个是Number类型,会把String类型转换成Number类型再进行比较

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

如果有一个操作符是布尔值,在比较时就会转换成Number类型再比较

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

如果有一个是对象,另一个不是,则会调用对象的 valueOf() 和 toString() 把对象进行一个转换

console.log([] == false); // true
console.log([] == 0); // true

只有 null 遇到 undefined 进行比较是 true,其他组合都是不相等的

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

===运算符

==,不做类型转换,类型不同的一定不等。

  • 先判断数据的类型是否相等,如果类型都不同,直接就返回 false
  • 如果数据类型相等,就会开始判断值是否相等
  • 如果两个都是 Object,那么会判断它们的引用地址是否一致
console.log(1 === '1'); // false
console.log(0 === false); // false
console.log(null === undefined); // false
let a = {};
let b = {};
let c = a;
console.log(a === b); // false
console.log(a === c); // true

练习

console.log("==========================")
		let obj = {
		    a: 10,
		    b: 'hello'
		};


		let obj1 = {
		    a: 10,
		    b: 'hello'
		};
		console.log(obj);
		console.log("对象之间比较,== 与 === 结果相同");
		console.log("obj == obj1结果:" + (obj == obj1));  // false 相同类型,== 与 === 无区别,比较引用
		console.log("obj === obj1结果:" + (obj === obj1));// false 相同类型,== 与 === 无区别,比较引用
		
		console.log("==========================")
		console.log("String与Number之间比较")
		let num = 10;
		let num1 = 10;
		let str = "10";
		let str1 = "String";
		console.log("String == Number结果:" + (num == str));  // true 转为Number值相同 
		console.log("String === Number结果:" + (num === str));// false 类型不同
		console.log("同类型值相同 == 结果:" + (num == num1));  // true 类型相同,值相同
		console.log("同类型值相同 === 结果:" + (num === num1));// true 类型相同,值相同
		console.log("同类型值不同 == 结果:" + (str == str1));  // false 类型相同, 值不同
		console.log("同类型值不同 === 结果:" + (str === str1));// false 类型相同, 值不同
		
		console.log("=========================");
		let objStr = '{"a":10,"b":"hello"}';
		console.log("对象与字符串 == 比较" + (objStr == obj));  // false 对象内容内部结构与字符串表示方式不同
		console.log("对象与字符串 === 比较" + (objStr === obj));// false 类型不同

输出:

==========================
{a: 10, b: 'hello'}
对象之间比较,== 与 === 结果相同
obj == obj1结果:false
obj === obj1结果:false
==========================
String与Number之间比较
String == Number结果:true
String === Number结果:false
同类型值相同 == 结果:true
同类型值相同 === 结果:true
同类型值不同 == 结果:false
同类型值不同 === 结果:false
=========================

到此这篇关于详解JavaScript运算符中==和===的区别的文章就介绍到这了,更多相关JavaScript运算符内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

最新评论