首页 >> js开发 >> js代码谈谈JavaScript令人迷惑的==与+
js代码谈谈JavaScript令人迷惑的==与+
发布时间: 2021年1月13日 | 浏览:
| 分类:js开发
前言前言前言相信很多学习过JavaScript的小伙伴都对JavaScript的==与+有一些疑惑,经常会出现结果与自己想象不一样的情况,而且也没找到一个通用的方法,只能死记硬背,非常难受。(咦,这不就是说的我嘛,嘻嘻嘻)今天就一起来揭开它们的神秘面纱,彻底解决掉他们。正式开始之前,先来小试牛刀一下:
null == undefined;
[] == [];
'23'= 23;
45 == [45];
false == undefined;
"" == [null];
{} + {};
false + 1
null == undefined;
[] == [];
'23'= 23;
45 == [45];
false == undefined;
"" == [null];
{} + {};
false + 1ToPrimitive函数ToPrimitive函数ToPrimitive函数ToPrimitive是一个内部函数,用于处理类型转换,从字面意思就知道这个函数的就是将变量转化为基本类型的一个函数。ToPrimitive(input, PreferredType)第一个参数是 input,表示要转化的值;第二个参数是PreferredType,表示希望转换成的类型,可为Number/String。
null == undefined //true 可以理解为两值都为无效的值,所以内部认为并无不同,所以相等
NaN == NaN //false
//如果两个symbol变量不指向同一内存空间那么永为false,否则为true
null == undefined //true 可以理解为两值都为无效的值,所以内部认为并无不同,所以相等
NaN == NaN //false
//如果两个symbol变量不指向同一内存空间那么永为false,否则为true2.两边类型不一致:2.两边类型不一致:(1). 先调用ToPrimitive()返回基本类型;(2). 若类型不一致,则调用ToNumber();( 这里的ToNumber也是一个内部函数,可将值转化为数字型 )举两个例子吧:
false == undefined //true
//false调用ToPrimitive返回false
//undefined调用ToPrimitive返回undefined
//false调用ToNumber返回0
//undefined调用ToNumber返回0
false == undefined //true
//false调用ToPrimitive返回false
//undefined调用ToPrimitive返回undefined
//false调用ToNumber返回0
//undefined调用ToNumber返回0
45 == [45] //true
//45调用ToPrimitive返回45
//[45]调用ToPrimitive返回"45"
//45调用ToNumber返回45
//"45"调用ToNumber返回45
45 == [45] //true
//45调用ToPrimitive返回45
//[45]调用ToPrimitive返回"45"
//45调用ToNumber返回45
//"45"调用ToNumber返回45+++一元操作运算符+一元操作运算符++作为一元操作运算符逻辑比较简单:先调用ToPrimitive,后调用ToNumber
+['1'] //1
//['1']调用ToPrimitive返回"1"
//"1"调用ToNumber返回1
+['1'] //1
//['1']调用ToPrimitive返回"1"
//"1"调用ToNumber返回1
+{} //NaN
//{}调用ToPrimitive返回"[object Object]"
//"[object Object]"调用ToNumber返回NaN
+{} //NaN
//{}调用ToPrimitive返回"[object Object]"
//"[object Object]"调用ToNumber返回NaN二元操作运算符+二元操作运算符++作为二元操作运算符逻辑如下:
两个值分别调用ToPrimitive;
如果两个的返回值中有一个为字符串类型,则返回两个值toString的拼接结果;
否则返回toNumber相加的结果
两个值分别调用ToPrimitive;如果两个的返回值中有一个为字符串类型,则返回两个值toString的拼接结果;否则返回toNumber相加的结果
null + 1 //1
//null调用ToPrimitive返回null
//1调用ToPrimitive返回1
//null调用ToNumber返回0
//1调用ToNumber返回1
//0 + 1 = 1
null + 1 //1
//null调用ToPrimitive返回null
//1调用ToPrimitive返回1
//null调用ToNumber返回0
//1调用ToNumber返回1
//0 + 1 = 1
[1, 2] + [3, 4] //"1,23,4"
//[1, 2]调用ToPrimitive返回"1,2"
//[3, 4]调用ToPrimitive返回"3,4"
//"1,2"调用toString返回"1,2"
//"3,4"调用toString返回"3,4"
//"1,2" + "3,4" = "1,23,4"
[1, 2] + [3, 4] //"1,23,4"
//[1, 2]调用ToPrimitive返回"1,2"
//[3, 4]调用ToPrimitive返回"3,4"
//"1,2"调用toString返回"1,2"
//"3,4"调用toString返回"3,4"
//"1,2" + "3,4" = "1,23,4"以上就是谈谈JavaScript令人迷惑的==与+的详细内容,关于JavaScript ==和+的资料请关注其它相关文章!
null == undefined;
[] == [];
'23'= 23;
45 == [45];
false == undefined;
"" == [null];
{} + {};
false + 1
null == undefined;
[] == [];
'23'= 23;
45 == [45];
false == undefined;
"" == [null];
{} + {};
false + 1ToPrimitive函数ToPrimitive函数ToPrimitive函数ToPrimitive是一个内部函数,用于处理类型转换,从字面意思就知道这个函数的就是将变量转化为基本类型的一个函数。ToPrimitive(input, PreferredType)第一个参数是 input,表示要转化的值;第二个参数是PreferredType,表示希望转换成的类型,可为Number/String。
当input是日期类型时,PreferredType为String,其余情况下都相当于传入Number。
当PreferredType传入参数时处理步骤会有差异,处理步骤分别如下:1.PreferredType传入Number1.PreferredType传入Number(1). 如果input为基本类型,直接返回;(2). 否则,调用valueOf方法,如果得到一个基本类值直接返回;(3). 否则,调用toString方法,如果得到一个基本类值直接返回;(4). 否则,JavaScript 抛出一个类型异常错误。2.PreferredType传入String2.PreferredType传入String(1). 如果input为基本类型,直接返回;(2). 否则,调用toString方法,如果得到一个基本类值直接返回;(3). 否则,调用valueOf方法,如果得到一个基本类值直接返回;(4). 否则,JavaScript 抛出一个类型异常错误。======上述介绍了ToPrimitive函数,那么对于==的结果就能有一个清晰的认知。我先给出一个判断逻辑,然后再以例子进行具体分析:1.两边类型一致时,基本变量就直接进行值比较,相同则为true,不同则为false,引用变量如果两边都指向同一个内存地址那么返回true,否则返回false。1.两边类型一致时,基本变量就直接进行值比较,相同则为true,不同则为false,引用变量如果两边都指向同一个内存地址那么返回true,否则返回false。特别情况:
null == undefined //true 可以理解为两值都为无效的值,所以内部认为并无不同,所以相等
NaN == NaN //false
//如果两个symbol变量不指向同一内存空间那么永为false,否则为true
null == undefined //true 可以理解为两值都为无效的值,所以内部认为并无不同,所以相等
NaN == NaN //false
//如果两个symbol变量不指向同一内存空间那么永为false,否则为true2.两边类型不一致:2.两边类型不一致:(1). 先调用ToPrimitive()返回基本类型;(2). 若类型不一致,则调用ToNumber();( 这里的ToNumber也是一个内部函数,可将值转化为数字型 )举两个例子吧:
false == undefined //true
//false调用ToPrimitive返回false
//undefined调用ToPrimitive返回undefined
//false调用ToNumber返回0
//undefined调用ToNumber返回0
false == undefined //true
//false调用ToPrimitive返回false
//undefined调用ToPrimitive返回undefined
//false调用ToNumber返回0
//undefined调用ToNumber返回0
45 == [45] //true
//45调用ToPrimitive返回45
//[45]调用ToPrimitive返回"45"
//45调用ToNumber返回45
//"45"调用ToNumber返回45
45 == [45] //true
//45调用ToPrimitive返回45
//[45]调用ToPrimitive返回"45"
//45调用ToNumber返回45
//"45"调用ToNumber返回45+++一元操作运算符+一元操作运算符++作为一元操作运算符逻辑比较简单:先调用ToPrimitive,后调用ToNumber
+['1'] //1
//['1']调用ToPrimitive返回"1"
//"1"调用ToNumber返回1
+['1'] //1
//['1']调用ToPrimitive返回"1"
//"1"调用ToNumber返回1
+{} //NaN
//{}调用ToPrimitive返回"[object Object]"
//"[object Object]"调用ToNumber返回NaN
+{} //NaN
//{}调用ToPrimitive返回"[object Object]"
//"[object Object]"调用ToNumber返回NaN二元操作运算符+二元操作运算符++作为二元操作运算符逻辑如下:
两个值分别调用ToPrimitive;
如果两个的返回值中有一个为字符串类型,则返回两个值toString的拼接结果;
否则返回toNumber相加的结果
两个值分别调用ToPrimitive;如果两个的返回值中有一个为字符串类型,则返回两个值toString的拼接结果;否则返回toNumber相加的结果
null + 1 //1
//null调用ToPrimitive返回null
//1调用ToPrimitive返回1
//null调用ToNumber返回0
//1调用ToNumber返回1
//0 + 1 = 1
null + 1 //1
//null调用ToPrimitive返回null
//1调用ToPrimitive返回1
//null调用ToNumber返回0
//1调用ToNumber返回1
//0 + 1 = 1
[1, 2] + [3, 4] //"1,23,4"
//[1, 2]调用ToPrimitive返回"1,2"
//[3, 4]调用ToPrimitive返回"3,4"
//"1,2"调用toString返回"1,2"
//"3,4"调用toString返回"3,4"
//"1,2" + "3,4" = "1,23,4"
[1, 2] + [3, 4] //"1,23,4"
//[1, 2]调用ToPrimitive返回"1,2"
//[3, 4]调用ToPrimitive返回"3,4"
//"1,2"调用toString返回"1,2"
//"3,4"调用toString返回"3,4"
//"1,2" + "3,4" = "1,23,4"以上就是谈谈JavaScript令人迷惑的==与+的详细内容,关于JavaScript ==和+的资料请关注其它相关文章!
相关文章:
- js详解Vue中的watch和computedjs大全
- js如何手写一个简易的 Vuexjs大全
- js全网小程序接口请求封装实例代码js大全
- jsvue router-link 默认a标签去除下划线的实现js大全
- jsVUE异步更新DOM - 用$nextTick解决DOM视图的问题js大全
- js微信小程序基于ColorUI构建皮皮虾短视频去水印组件js大全
- js解决element-ui的下拉框有值却无法选中的情况js大全
- js解决VueCil代理本地proxytable无效报错404的问题js大全
- js解决Element中el-date-picker组件不回填的情况js大全
- JavaScriptnuxt.js添加环境变量,区分项目打包环境操作