js == 运算规则解析

2023-11-13

1.先了解一下基本类型和复杂类型划分的依据

JS中的值有两种类型:原始类型(Primitive)、对象类型(Object)。原始类型包括:Undefined、Null、Boolean、Number和String等五种。这两大类别的数据存储方式是不一样的。

存储空间的时空关系可以概括为空间大,访问起来就慢,反之亦然。堆比栈大,栈比堆的运算速度快,

对象是一个复杂的结构,并且可以自由扩展,如:数组可以无限扩充,对象可以自由添加属性。将它们放在堆中是为了不影响栈的效率。而是通过引用的方式查找到堆中的实际对象再进行操作。

相对于对象类型而言,原始类型就比较稳定,并且它只占据很小的内存。不将原始类型放在堆是因为通过引用到堆中查找实际对象是要花费时间的,而这个综合成本远大于直接从栈中取得实际值的成本。所以简单数据类型的值直接存放在栈中。`

顺带说一下undefined和null的使用区别:

假如你打算把一个变量赋予对象类型的值,但是现在还没有赋值,那么你可以用null表示此时的状态(证据之一就是typeof null 的结果是'object');相反,假如你打算把一个变量赋予原始类型的值,但是现在还没有赋值,那么你可以用undefined表示此时的状态。

 

2.进行==比较时数据的转换规则

 ==运算规则的准备描述如下:

看完之后有没有感觉有点脑壳疼,这样的描述很难让人在实践中使用,所以很有必要对上述规则进行简化概括:

  • undefined == null,结果是true。且它俩与所有其他值比较的结果都是false。

  • String == Boolean,需要两个操作数同时转为Number。

  • String/Boolean == Number,需要String/Boolean转为Number。

  • Object == Primitive,需要Object转为Primitive(具体通过valueOf和toString方法)。

 

 

 

 那么Boolean,Number,Primitive的转换规则是:

(1)其它类型转换成Boolean的规则是:

(2)其它类型转换成Number类型的规则

object类型一般要先转换成string类型,接着才进行Number类型的转换。字符串转化为数字的规则规范中描述得很复杂,但是大致说来,就是把字符串两边的空白字符去掉,然后把两边的引号去掉,看它能否组成一个合法的数字。如果是,转化结果就是这个数字;否则,结果是NaN。

Number('123') // 结果123
Number('1.2e3') // 结果1200
Number('123abc') // 结果NaN
Number('\r\n\t123\v\f') // 结果123

当然也有例外,比如空白字符串转化为数字的结果是0。即:

Number('') // 结果0
Number('\r\n\t \v\f') // 结果0
需要补充说明的是:
(3)对象类型向primitive类型转换的规则是:

     为什么要区分原始类型和复杂类型?

     原始类型是一种单纯的类型,它们直接了当、容易理解。然而缺点是表达能力有限,难以扩展,所以就有了对象。对象是属性的集合,而属性本身又可以是对象。所以对象可以被构造得任意复杂,足以表示各种各样的事物。

  但是,有时候事情复杂了也不是好事。比如一篇冗长的论文,并不是每个人都有时间、有耐心或有必要从头到尾读一遍,通常只了解其中心思想就够了。于是论文就有了关键字、概述。JavaScript中的对象也一样,我们需要有一种手段了解它的主要特征,于是对象就有了toString()和valueOf()方法。

     这两种方法的区别是:

toString()方法用来得到对象的一段文字描述;而valueOf()方法用来得到对象的特征值。

   toString()方法倾向于返回一个字符串。valueOf()方法倾向于返回一个数字——尽管内置类型中,valueOf()方法返回数字的只有Number和Date。


对于所有非日期对象来说,对象到原始值的转换基本上是对象到数字的转换

  一般来说,对象到数字的转换经过了如下过程:

  1.如果对象具有valueOf()方法,后者返回一个原始值,则js将这个原始值转换成数字,并返回这个数字。

  2.否则,如果对象具有toString()方法,后者返回一个原始值,则js将转换并返回。(首先js转换成相应的字符串原始值,再继续将这个原始值转换成相应的数字类型,再返回数字)

  3.否则,js抛出一个类型错误异常。

  一般来说,对象到字符串的转换经过了如下步骤:

  1.如果对象具有toString()方法,则调用这个方法。如果它返回一个原始值,js将这个值转换成字符串,并返还这个字符串结果。

  2.如果对象没有toString()方法,或者toString并不返回一个原始值,那么js将调用valueOf()方法。

  3.否则,js无法从toString()或者valueOf()获得一个原始值,因此这时它将抛出一个类型错误异常。

 
下图第一列和第二列是其它类型调用toString方法时的转换规则

    需要说明的是: toString方法会将{}转换成"[object Object]",将function(){}转换成"function(){}"

 

    其它类型调用valueOf方法的转换规则是:

 

    经过层层深入剖析,现在你应该理解前面各种数据类型进行 == 运算时的隐式运作规则了吧。现在再碰到如下的问题,是不是感觉思路很清晰

 

[]==[]             //false
[]==![]            //true
{}==!{}            //false  实际上被解析成 { ' } == !{ ' }
{}==![]            //Uncaught SyntaxError: Unexpected token == 表达式不能以{开头 {}是个语句块,后面跟== ![]就变成了一种语法错误的语句块
// 在语法解析的时候,如果一个语句以「{」开头,就只把它解释成语句块。换用形式语法的说法,就是「表达式语句不能以『{』开头」。对表达式语句开头的另一个限制——限制「function」出现在开头——同理。 ![]=={} //false []==!{} //true undefined==null //true

[]  == []  // false 因为它们的引用地址不一样

由上面的比较可以得出:
对任何一种类型进行取反 会得到一个boolean类型的值
[]在与不同的类型对比的时候,会转换成0
{}在与不同的类型对比的时候,会转换成NaN,
不同类型的比较最终都被转换成number类型的比较

参考文章

[1]
一张图彻底搞懂JavaScript的==运算

    [2] 为什么控制台打印{}+[]===[]+{}为false?



 

转载于:https://www.cnblogs.com/wangpenghui522/p/6720692.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

js == 运算规则解析 的相关文章

随机推荐

  • vue2 webpack版批量注册全局组件

    使用背景 用vue开发的所有项目 都是采用组件化的思想开发的 分为公共组件和功能组件 又可以分为全局自定义组件和局部自定义组件 全局自定义组件在main js文件直接引入 这种是最简单的方式 使用缺点 如果我们需要注册的全局组件非常多 那么
  • 移动端 - 搜索组件(search-list篇)

    移动端 搜索组件 search input篇 移动端 搜索组件 suggest篇 这里我们需要去封装搜索历史组件 这一个组件还是很简单的 但是逻辑部分需要根据实际的需求来进行书写 所以这里我不太好去写实际的代码 不过可以提供我的思路 主要的
  • Spring的事务

    目录 一 Spring的事务 二 Spring事务如何实现 三 Spring事务的失效 一 Spring的事务 当我们在某个方法上添加了 Transactional注解后 就表示该方法在调用时会开启Spring事务 而这个方法所在的类所对应
  • 第九课,OpenGL光照之材质

    物体材质 在冯氏模型中 一个物体的材质由 全局光照系数 漫反射光照系数 反射光照系数 反射高光半径系数决定 分别由 ambient diffuse specular shininess表示 材质系数 The numbers Name Amb
  • 【博客管理】博客目录导航【置顶】

    一 OpenCV学习 OpenCV学习笔记 函数学习 OpenCV学习笔记 函数学习 一 MFC OpenCV2 4 7读取摄像头之cvCaptureFromCAM 的索引问题 OpenCV学习笔记 函数学习 二 MFC OpenCV2 4
  • 【华为OD机试2023】字符串解密 java python c++

    字符串解密 题目 题目描述 给定两个字符串string1和string2 string1是一个被加扰的宇符串 string1由小写英文字母 a z 和数字字符 0 9 组成 而加扰字符串由 0 9 a z 组成 string1里面可能包含0
  • 使用js控制浏览器开启全屏,判断浏览器是否处于全屏状态

    引入lodash import from lodash 切换全屏方法 export function fullScreen isOpen target let dom target void 0 let open list requestF
  • 什么是.Net?

    NET 是一个开发平台 或者叫开发者平台 使用 NET 你可以创建不同类型的应用程序 使用多种开发语言 编辑器和工具库创建网页 手机 桌面以及游戏等应用 其核心特点是 免费 开源和跨平台 1 语言和平台 我们先来理解一下什么是 NET 开发
  • URL 转为QR code(二维码)

    总结几种把网页url转为二维码的方法 1 Chrome浏览器 最快的一种方法就是用chrome自带的QR code分享 这种方法的缺点就是不能自定义二维码的格式 颜色 logo之类的 都是默认的小恐龙图标 2 chrome插件 可以在chr
  • 关于非同一局域网下两台设备之间的网络通信(服务器的作用)

    看过很多关于局域网下的两台设备之间的通信方式 最多的就是通过socket进行tcp ip通信 建立一个服务端 再建立一个客户端 客户端向服务端发起请求连接 然后再进行两端的通信 但发现其实这却存在着很多的问题与不足 如果是不在同一局域网下的
  • 新手搭建 react antd 环境笔记

    安裝依赖 npm install g create react app npm install antd mobile save npm install less loader less save dev npm install react
  • LeetCode【345】反转字符串中的元音字母

    题目 编写一个函数 以字符串作为输入 反转该字符串中的元音字母 示例 1 输入 hello 输出 holle 示例 2 输入 leetcode 输出 leotcede 说明 元音字母不包含字母 y public class LeetCode
  • linux system call

    1 SYSCALL DEFINE4 reboot 2 int magic1 3 int magic2 4 unsigned int cmd 5 void user ang 6 7 if capable CAP SYS BOOT 8 retu
  • python数据分析练习题

    本次作业尝试使用ipython和jupyter的notebook功能来实现py代码 首先是要配置环境 通过命令 pip install ipython pip install jypyter ipython notebook 配置并打开no
  • [机器学习]1.2虚拟环境&基础包安装初始化

    机器学习 第一章 Centos环境安装初始化 第二章 virtualenv及基础包环境安装初始化 机器学习 1 2虚拟环境 基础包安装初始化 机器学习 前言 一 python安装 二 pip3 virtualenv安装及环境变量配置 1 配
  • 08 FPGA—计数器与分频器的应用

    1 理论 时序逻辑电路中最基本的单元 寄存器 我们可以使用寄存器来做计数器 基本上关于时间的设计都离不开计数器 计数器在数字系统中主要是对脉冲的个数进行计数 以实现测量 计数和控制的功能 同时兼有分频功能 计数器一般都是从 0 开始计数 计
  • 第四章-图像加密与解密

    加密与加密原理 使用异或运算实现图像加密及解密功能 异或运算规则 相同为0 不同为1 运算数相同 结果为0 运算数不同 结果为1 任何数 0 1 与0异或 结果仍为自身 任何数 0 1 与1异或 结果为另外一个数 即0变1 1变0 任何数和
  • Ubuntu查看系统日志的几种方法

    在 Ubuntu 22 10 中 你可以查看系统日志来排查错误 以下是几种查看日志的方法 一 Journalctl 命令 使用 journalctl 命令可以查看系统日志信息 包括引起闪退的错误信息 你可以运行以下命令来查看最新的系统日志
  • GDAL根据Shape文件切图(java)

    目地 用Java实现类似QGIS中 按掩膜图层裁剪栅格 的功能 其实QGIS本身调用的就是gdalwarp exe 官方文档 https gdal org programs gdalwarp html gdalwarp gdalwarp h
  • js == 运算规则解析

    1 先了解一下基本类型和复杂类型划分的依据 JS中的值有两种类型 原始类型 Primitive 对象类型 Object 原始类型包括 Undefined Null Boolean Number和String等五种 这两大类别的数据存储方式是