JavaScript/TypeScript中==和===的区别详解

在JS/TS项目里，除了能看到==操作符来判断两个变量是否相等外，我们还会看到===操作符，这两者有什么区别吗？

先上结论，

  • 对于String, number这些基础类型，==操作符会先把两边的变量进行类型强制转换成相同的类型再比较是否相等；===操作符则不会进行类型转换，而是直接进行比较。
  • 对于array, object这些高级类型，==和 ===是没有区别的，因为它们比较的是 “指针地址” 。
  • 对于基础类型和高级类型，== 和 ===是有区别的；==操作符会先把高级类型转换为基础类型之后，进行值的比较；===操作符则不会进行转换，类型不同，直接返回false

也就是说，`==`操作符只要求比较两个变量的值是否相等，`===`操作符则是要求两个变量的值和类型都要相同；类似地，`!=`操作符会去做类型强制转换，`!==`操作符则不会转换类型。

我们写个基础类型变量的代码示例一下：

66 ==  '66'; // 返回true
66 === '66' // 返回false

==操作符会把第一行里的字符串转换成数字，与66再进行比较，值相等，于是返回true；===操作符则不会做类型转换，因为左边数字，右边字符串，两者类型不同，就会返回false。

注意对于特殊值NaN（Not a Number），表示非数字，NaN和任何数（包括它自己）做相等比较，都会返回false，所以判断NaN最好用isNaN()函数；
而对于undefined和null，两者的值相比较，会返回true。

代码示例如下：

NaN == 6; // 返回false
NaN === NaN; // 返回false
null == undefined; // 返回true
null === undefined; // 返回false

最后， 由于==和!=操作符带来的类型隐式转换规则非常繁琐，还有为了避免数据类型混淆导致出现bug，还是推荐使用===操作符和!==操作符。

js在比较的时候如果是 == 会先做类型转换，再判断值得大小，如果是===类型和值必须都相等。

总结

到此这篇关于 JavaScript/TypeScript中==和===区别的文章就介绍到这了,更多相关 js/ts中==和===的区别内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • 浅谈JS中的!=、== 、!==、===的用法和区别

    var num = 1; var str = '1'; var test = 1; test == num //true 相同类型 相同值 test === num //true 相同类型 相同值 test !== num //false test与num类型相同,其值也相同, 非运算肯定是false num == str //true 把str转换为数字,检查其是否相等. num != str //false == 的 非运算 num === str //false 类型不同,直接返回fals

  • javascript中if和switch，==和===详解

    javascript中if和switch，==和===详解

    今天改插件BoxScroll的时候,因为if里面的条件判断多于两个,于是立马想着改写switch.改到一半,忽然记起来JSHint等代码质量检测工具中的一个要求,用===替换==,不用不可靠的强制转型.然后忽然猜想,改成switch是不是会降低效率啊?switch里面的实际判断是==还是===? 有了想法,赶紧举个栗子,好一口吃掉: var a = '5'; switch (a) { case 5: console.log('=='); break; case "5": console

  • JavaScript中三个等号和两个等号的区别(== 和 ===)浅析

    == equality 等同,=== identity 恒等. ==, 两边值类型不同的时候,要先进行类型转换,再比较. ==,不做类型转换,类型不同的一定不等. 下面分别说明: 先说 ===,这个比较简单.下面的规则用来判断两个值是否===相等: 1.如果类型不同,就[不相等] 2.如果两个都是数值,并且是同一个值,那么[相等]:(!例外)的是,如果其中至少一个是NaN,那么[不相等].(判断一个值是否是NaN,只能用isNaN()来判断) 3.如果两个都是字符串,每个位置的字符都一样,那么[

  • 详解js中==与===的区别

    为了减少概念混淆,应该把 =称作(得到或者赋值),==称作(相等),===称作(严格相等) 相同点: 它们两个运算符都允许任意类型的的操作数,如果操作数相等,返回true,否则返回false 不同: ==:运算符称作相等,用来检测两个操作数是否相等,这里的相等定义的非常宽松,可以允许进行类型转换 ===:用来检测两个操作数是否严格相等 1.对于string,number等基础类型,==和===是有区别的 不同类型间比较,==之比较"转化成同一类型后的值"看"值"是否

  • javascript中等于（==）与全等（===）的区别说明

    var y = 5; if(y == "5"){ document.write("== '5' True "); } else{ document.write("== '5' False "); } if(y == 5){ document.write("== 5 数字 is True "); } else{ document.write("== 5 数字 False "); } if( y === 5){

  • 浅析Javascript中“==”与“===”的区别

    之前使用JavaScript的时候,时不时的会遇到使用 == 和 === 这两个符号来判断两个变量是否相等.但是对于这两个符号的差别一直没有去调查.今天又遇到了 === 这个符号,所以决定去查一下,究竟这两者有什么区别. 在Javascript中有"=="和"==="两种比较运行符,那么他们有什么区别呢? 一.对于string,number等基础类型,==和===是有区别的 1)不同类型间比较,==之比较"转化成同一类型后的值"看"值&

  • javaScript中"=="和"==="的区别详解

    区别: ==, 两边值类型不同的时候,要先进行类型转换,再比较. ==,不做类型转换,类型不同的一定不等. 下面分别说明: 先说 "===",这个比较简单.下面的规则用来判断两个值是否===相等: 1.如果类型不同,就不相等 2.如果两个都是数值,并且是同一个值,那么[相等]:(!例外)的是,如果其中至少一个是NaN,那么[不相等].(判断一个值是否是NaN,只能用isNaN()来判断) 3.如果两个都是字符串,每个位置的字符都一样,那么相等:否则不相等 . 4.如果两个值都是true

  • JavaScript中的"=、==、==="区别讲解

    = 是赋值运算,== 用于一般比较,=== 用于严格比较 == 在比较的时候可以转换数据类型: === 严格比较,只要类型不匹配就返回flase. 举例说明: "1" == true 类型不同,"=="将先做类型转换,把true转换为1,即为 "1" == 1: 此时,类型仍不同,继续进行类型转换,把"1"转换为1,即为 1 == 1: 此时,"==" 左右两边的类型都为数值型,比较成功! 如果比较:&qu

  • JS中==与===操作符的比较

    ===操作符: 要是两个值类型不同,返回false 要是两个值都是number类型,并且数值相同,返回true 要是两个值都是stirng,并且两个值的String内容相同,返回true 要是两个值都是true或者都是false,返回true 要是两个值都是指向相同的Object,Arraya或者function,返回true 要是两个值都是null或者都是undefined,返回true ==操作符: 如果两个值具有相同类型,会进行===比较,返回===的比较值 如果两个值不具有相同类型,也有

  • JavaScript/TypeScript中==和===的区别详解

    JavaScript/TypeScript中==和===的区别详解

    在JS/TS项目里,除了能看到==操作符来判断两个变量是否相等外,我们还会看到===操作符,这两者有什么区别吗? 先上结论, 对于String, number这些基础类型,==操作符会先把两边的变量进行类型强制转换成相同的类型再比较是否相等:===操作符则不会进行类型转换,而是直接进行比较. 对于array, object这些高级类型,==和 ===是没有区别的,因为它们比较的是 “指针地址” . 对于基础类型和高级类型,== 和 ===是有区别的:==操作符会先把高级类型转换为基础类型之后,进

  • C语言中const和C++中的const 区别详解

    C语言中const和C++中的const 区别详解 C++的const和C语言的#define都可以用来定义常量,二者是有区别的,const是有数据类型的常量,而宏常量没有,编译器可以对前者进行静态类型安全检查,对后者仅是字符替换,没有类型安全检查. 而C语言中的const与C++也有很大的不同,在C语言中用const修饰的变量仍是一个变量,表示这个变量是只读的,不可显示地更改,而在C++中用const修饰过后,就变成常量了.例如下面的代码: const int n=10; int a[n];

  • 从go语言中找&和*区别详解

    *和&的区别 :& 是取地址符号 , 即取得某个变量的地址 , 如 ; &a*是指针运算符 , 可以表示一个变量是指针类型 , 也可以表示一个指针变量所指向的存储单元 , 也就是这个地址所存储的值 . 从代码中验证 : 先构建一个Rect类型 : 1. &是取地址符号, 取到Rect类型对象的地址 2. *可以表示一个变量是指针类型(r是一个指针变量): 3.*也可以表示指针类型变量所指向的存储单元 ,也就是这个地址所指向的值 4.查看这个指针变量的地址 , 基本数据类型直

  • RxJS在TypeScript中的简单使用详解

    1. 安装 # 安装 typescript, rxjs 包 npm install -D typescript @types/node npm install rxjs 2. 使用 2.1 使用 from 来从数组生成源 RxJS 有许多创建源的方法,如 from, fromEvent..., 这里使用 from做个例子 import {from} from 'rxjs' // 从数组生成可订阅对象 // obser 的对象类型为 Observable let obser = from([1,2

  • C语言中 & 和 &&的区别详解

    这是c语言的基本语法,但是在学习的过程中也总是搞混.所以记录一下,也和大家分享一下. &:按照位与操作,例如:0010&1101,结果为0000 &是java中的位逻辑运算:       eg: 2&3=2: 分析如下: 2的二进制为10 :3的二进制为11 : 逻辑&之后为10 &&:短路与,表示如果两个条件都成立则执行之后的逻辑: 例如:if(a==0&&b==0),意思就是if a为0并且b为0的时候,进行下一步操作. || 短

  • Servlet中/和/*的区别详解

    Servlet中/和/*的区别详解

    目录 本文提纲 版本约定 ✍正文 点拨"市面上"的错误答案 1./用于Servlet,/*用于Filter 2./不会匹配.jsp请求,而/*可以匹配到.jsp请求 3./*匹配范围比/大 4./匹配所有url(路径+后缀),/*只匹配路径型 Servlet四种匹配方式 1. 精确匹配 2. 路径匹配 3. 后缀名匹配 4. 缺省匹配 URL匹配注意事项 匹配顺序 /和/*的区别 DispatcherServlet不拦截.jsp请求根因分析 ✍总结 本文提纲 版本约定 JDK:8 Se

  • JavaScript 设计模式中的代理模式详解

    JavaScript 设计模式中的代理模式详解

    前言: 代理模式,代理(proxy)是一个对象,它可以用来控制对另一个对象的访问. 现在页面上有一个香港回归最想听的金典曲目列表: <ul id="container"> <li>我的中国心</li> <li>东方之珠</li> <li>香港别来无恙</li> <li>偏偏喜欢你</li> <li>相亲相爱</li> </ul> 需要给页面添加

  • TypeScript中的方法重载详解

    TypeScript中的方法重载详解

    前言 方法重载(overload)在传统的静态类型语言中是很常见的.JavaScript 作为动态语言, 是没有重载这一说的.一是它的参数没有类型的区分,二是对参数个数也没有检查.虽然语言层面无法自动进行重载,但借助其动态的特性,我们可以在代码中手动检查入参的类型,或者通过 arguments 获取到参数个数,从而实现根据不同的入参做不同的操作. 比如有一个获取聊天消息的方法,根据传入的参数从数组中查找数据.如果入参为数字,则认为是 id,然后从数据源中找对应 id 的数据并返回,否则当成类型,

  • C字符串与C++中string的区别详解

    在C++中则把字符串封装成了一种数据类型string,可以直接声明变量并进行赋值等字符串操作.以下是C字符串和C++中string的区别:  C字符串 string对象(C++) 所需的头文件名称  <string>或<string.h> <string>或<string.h> 需要头文件 原因 为了使用字符串函数 为了使用string类 声明 方式 char name[20]; string name; 初始化方式 char name[20]="

随机推荐