从 ECMA标准看类型转换|探索永远是解决问题的最好方案🌟

简介: 从 ECMA标准看类型转换|探索永远是解决问题的最好方案🌟

抛出一个问题


昨天我的群里有人问了这样一个问题:


+[1]
// 1
+[1,2]
// NaN
// 提问:为什么第一个返回 1,第二个返回 NaN 呢?


这是一个很小的问题,但是我本能的反感,一看就是无聊到极致的面试官问出来的,如果是我就会反问:


  • 什么场景下会出现这种问题?
  • 如果真有这种场景要写这样的代码,你有没有考虑后续维护的问题?

但是作为一个温柔的小群主,我还是要去解答这个问题,但是我同时更想通过问题去提升提问者解决问题的能力,因为:

  • 问题是层出不穷的,而解决问题的能力是贯穿整个职业生涯的

于是就有了这篇文章,带着大家从看到问题到寻找权威的解释去对问题进行解答与探索,毕竟授人以鱼,不如授人以渔。


寻觅答案之旅


我们可以先将问题做一个转换:


Number([1])
// 1
Number([1,2])
// NaN


即:为什么数组 [1] 转为 Number 类型是 1,而数组 [1,2] 转为 Number 类型是 NaN。

这时我们可以前往 ECMA 的官网去寻找答案,众所周知 ECMAScript 语言规范所对应的是 ECMA-262:


www.ecma-international.org/publication…

根据网页中的指引,我们可以寻找到 ecma262 标准的文档:

tc39.es/ecma262/


对于上面的一些专有词汇进行简要解释:


  • ECMA:ECMA国际组织,全称是Ecma International (以前叫 ECMA - European Computer Manufacturers Association - 欧洲计算机制造商协会)是个行业标准组织,它所通过的标准都是 ECMA-nnn 这样进行编号。
  • tc39:是ECMA 国际组织第 39 号技术委员会( Technical Committee ),它是一个推动 JavaScript 发展的委员会。TC39 由各个主流浏览器厂商的代表构成,他们的主要工作就是制定 ECMAScript 标准,标准生成的流程,并实现。


进入到页面,我们第一步当然是找到 Number:


网络异常,图片无法展示
|


这时我们发现,Number 作为方法调用的时候我们会执行 ToNumeric(value) 方法:


网络异常,图片无法展示
|


这个方法会先去执行 ToPrimitive(value, number) 方法:


网络异常,图片无法展示
|


这个方法很长,也比较难去阅读,但是我们可以精准的发现,他无非是一个寻找转换类型 preferredType的过程,在这个问题里,我们这个类型就是 number,最后我们拿着这个东西去执行 OrdinaryToPrimitive(input, preferredType),我们似乎是看到曙光了:


网络异常,图片无法展示
|


这个方法会判断我们之前的 preferredType,因为我们这个类型是 number,所以 我们会先后执行 "valueOf", "toString",注意文档中的这句类代码:

If Type(result) is not Object, return result.


我们先执行了 valueOf ,如果返回值是个对象,我们才去执行 toString,然而,数组执行 valueOf 返回的是本身,所以这个方法最后返回的是 [xxx].toString()

而数组的 toString 会返回什么呢?,我们继续搜:


网络异常,图片无法展示
|


看到这里我们就不需要继续往下看了,很显然会执行数组的 join 方法,而 join 默认是由 ',' 进行拼接的:


网络异常,图片无法展示
|


而这个问题就很简单的转换为了:


Number('1')
// 1
Number('1,2')
// NaN


这样答案就显而易见了🌟

我们这次探索的目标也就达成了


解决问题是一种能力


其实我们做一个程序员,经常会遇到各种问题,但是遇到问题,我们可以通过自己的方法找到更加权威的解答一定是我们向上成长的关键能力。

相关文章
|
4月前
IEC104初学者教程,第六章:信息对象类型归总
信息对象类型(Type Identification, TI)字段用于指示报文中包含的信息对象的类型。信息对象类型字段通常是一个字节(8位),表示不同种类的数据或命令。每种类型的值代表一种特定的电力系统数据或控制指令,接收方根据此字段来解析和处理报文中的具体信息。
51 2
|
6月前
|
存储 JavaScript 前端开发
深度剖析JavaScript中的变量世界:概念、用例与避坑指南
【4月更文挑战第3天】探索JavaScript变量:了解var、let、const的差异,掌握数据类型、用例及避免错误的策略。声明变量时注意作用域和可变性,如var的函数作用域,let和const的块级作用域。理解基本数据类型(Number、String等)和对象类型。示例包括用户输入、计算、控制流程和函数参数。警惕未声明、作用域混淆、类型不匹配和未初始化的错误,遵循最佳实践,如明确命名、避免冗余和适时复用,利用类型检查工具提升代码质量。
101 1
|
6月前
|
JavaScript 前端开发 开发者
探究ECMAScript 6的新特性
ECMAScript 6(也称为ES6或ECMAScript 2015)是JavaScript的一个重大更新,它引入了许多新特性和改进,使得JavaScript的开发更加简单和高效。在本篇博客中,我们将详细介绍ECMAScript 6的新特性。
72 1
探究ECMAScript 6的新特性
|
6月前
|
存储 算法 C语言
【编程陷阱】编写出色C++代码:遵循的注意事项和最佳实践
【编程陷阱】编写出色C++代码:遵循的注意事项和最佳实践
59 0
|
6月前
|
JavaScript 前端开发
一文读懂TypeScript类型兼容性
一文读懂TypeScript类型兼容性
|
算法 程序员 C语言
01-C++核心语法|C++概述【C++简介、C++起源、可移植性和标准、为什么C++会成功、从一个简单的程序开始认识C++】
复习`C++核心语法`,且适当进行汇编探索底层实现原理,进一步夯实基础,为以后的`底层开发`、`音视频开发`、`跨平台开发`、`算法`等方向的进一步学习埋下伏笔。
01-C++核心语法|C++概述【C++简介、C++起源、可移植性和标准、为什么C++会成功、从一个简单的程序开始认识C++】
|
数据采集 算法 Shell
【C#编程最佳实践 七】代码书写规范实践
【C#编程最佳实践 七】代码书写规范实践
131 0
【C#编程最佳实践 七】代码书写规范实践
|
Java 编译器 C语言
【JAVA数据结构】Java语法完善补充
JAVA数据结构 & Java语法完善补充
46 0
【JAVA数据结构】Java语法完善补充
|
XML 前端开发 JavaScript
web开发标准是什么意思?底层原理是什么?
web开发标准是什么意思?底层原理是什么?
142 0
|
安全 编译器 程序员
【C++】C++补充知识&C++11及其特性
【C++】C++补充知识&C++11及其特性
【C++】C++补充知识&C++11及其特性