从[]==flase看js隐性转换

JS的数据类型

首先,回想一下JS的类型都有什么。

原始值(primitives): undefined, null, booleans, numbers,strings, symbol(es6)

对象值(objects): Object

ok, 这就是全部了,我们接下来看看到底发生了什么导致隐式转换如此不可捉摸。

ToPrimitive

在发生转换的时候,js其实都是会将操作对象转化为原始的对象,这也是最为诟病的地方,因为js很难直接抛出错误,她会用一套自己的方法去理解我们的错误,并做相应的调整,哪怕这些错误我们是无意识的。所以我们要知道她的转换方式,才能做到知己知彼,对代码的控制更为精准。

签名:ToPrimitive(input, PreferredType?) //PreferredType: Number 或者 String

流程如下:

  1.  input为原始值,直接返回;
  2. 不是原始值,调用该对象的valueOf()方法,如果结果是原始值,返回原始值;
  3. 调用valueOf()不是原始值,调用此对象的toString()方法,如果结果为原始值,返回原始值;
  4. 如果返回的不是原始值,抛出异常TypeError。

其中PreferredType控制线调取valueOf()还是toString()。

ps: Date类型按照String去调用。

ok,通过这个隐式装箱,我们得到了操作数的原始值。接下来,我们根据不同情况,看看发生了什么呢~

数学运算

想必大家用过以下做法去完成类型转换吧

var str = '1';
var num = str - 0;

var num = 2;
var str = num + '';

这种类似的数学运算会做类型转换,*/-操作符都是数字运算专用的。当这些运算符与字符串一起使用时,会强制转换字符串为数字类型的值。但是‘+’尤为致命,为啥捏?

当'+'作为双目运算符时,如a+b。

它的运行如下:

  1. 计算两个操作数的原始值: prima = ToPrimitive(a), prima = ToPrimitive(b);
  2. 如果原始值有String,全部转换为String,返回String相加后的结果;
  3. 如果原始值没有String,全部转换为Number, 返回Number相加后的结果;

当'+'作为单目运算符时, 例如 +a.相当于是Number(a);//+=>Number()

举个栗子:

[] + []  //都不是string类型,调用ToPrimitive()方法,得"";

 

{} + [] 与 [] + {} //得“[Object,Object]”

{} + []
1. 在浏览器中,JS引擎认为第一个{}为空代码块,所以 这里的 '+'是单目运算符(node中认为是对象,解析为"[object Object]")

ToPrimitive([]); //""

2. Number("");//0


[] + {}
1. ToPrimitive([]); //""
    ToPrimitive({}); //"[object Object]"

2. 都为string
    return "" + "[object Object]";//"[object Object]"

PS: [].valueOf 为[], 但在ES6中JS会优先调用[Symbol ToPrimitive]来转换为原始类型。

比较运算

首先,比较运算分为2种, 一种为严格比较(===),只有类型相等,值也一致时才会为true,否则为false, 另一种为抽象相等也叫宽松相等(==),先将运算数转化为相同类型,再做比较,具体过程见 Abstract Equality Comparison Algorithm

这个算法大致说了这么几个情况,x == y

  • xy都为Null或undefined,return true;
  • x或y为NaN, return false;
  • 如果x和y为String,Number,Boolean并且类型不一致,都转为Number再进行比较
  • 如果存在Object,转换为原始值,比较

回到这篇文章的导火索,[] == false

1.存在object, 转化为原始值
ToPrimitive([]); // ''

2.一个string, 另外为boolean,都转为number
Number('');//0
Number(false);//0

3.return 0 == 0;/true

 

备注

ToPrimitive

 

 valuetoNumber toString toBoolean 
 NaN NaN "NaN" false
 Infinity Infinity "Infinity" true
 [] 0 '"" true
 [1] 1 "1" true
null0"null"false
undefinedNaN"undefined"false
{}NaN"[object Object]"true
function()NaN"function"true

ToNumber

 

ToString

 

转载自:https://www.cnblogs.com/nanchen/p/7905528.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值