JavaScript中的加法

JS加法问题

先来看一些简单的 + 法：

console.log(1+1);       //2
console.log("1"+1);     //"11"
console.log(NaN + 1);   //NaN
console.log(NaN + "1"); //"NaN1"
console.log(null + 1);  //1
console.log(null + "1");//"null1"

分析总结就是：字符串类型和其它数据类型“+”，先把其它数据转为字符串类型，再进行拼接

一些较难理解的 + 法：

console.log([1] + 1);       //"11"
console.log([1,2] + [1]);   //"1,21"
console.log([1] + {n:1});   //"1[object Object]"

直接看看不懂，先给出加法运算规则（灰常重要！！！）：

eg：console.log([1,2] + [3,4]) 结果为？

    <script>
        console.log([1,2].valueOf().toString());  //'1,2'
        console.log([3,4].valueOf().toString());  //'3,4'   '1,2' + '3,4' = '1,23,4'
    </script>

现在给出例子理解加法运算规则：

eg1：console.log(null + undefined);结果为？

console.log(null + undefined); //结果为 NaN ,为什么呢？

结果分析：结果为NaN, 依照上面加法运算规则来看，null和undefined都是基本数据类型，其都不是字符串，所以都转为数字类型，null和 undefined转为数字为什么呢？调用Number()函数，看结果如下：
console.log(Number(null));     //0
console.log(Number(undefined));//NaN  （重点）
所以现在相当于就是console.log(0 + NaN); + 两端有一端为 NaN,所以结果为NaN.

eg2：console.log(NaN + "1");结果为？ "NaN1"

扫描二维码关注公众号，回复： 17060344 查看本文章

NaN 看作是一种基本数据类型。

分析：NaN 和"1"都是基本数据类型，按照上面加法运算规则，有字符串的都转为字符串类型，所以转为字符串类型，调用 String();结果如下：
console.log(String(NaN));  //"NaN"
所以结果为：console.log("NaN" + "1"); 就是一个字符串的拼接："NaN1"

eg3:console.log(1 + true); 结果为？

分析：1和true,一个为数字型，一个为boolean型，都是基本数据类型，且没有字符串，所以都转为数字型，true转为数字型：
console.log(Number(true));  // 1
console.log(Number(false)); // 0
结果为：console.log(1 + 1); 所以结果为2

eg4：console.log([1] + 1); 结果为？"11" 为什么呢？

分析：[1]是一个数组，数组是一个对象，所以按照上面加法运算规则，对象先调用valueOf(),

就是 [1].valueOf();
console.log([1].valueOf()); //还是得到一个数组对象 [1]
得到的是一个数组对象[1]，没有得到基本数据类型，就继续调用toString(); 就是[1].toString();
console.log([1].toString()); //"1"
得到了原始类型数据"1",现在结果就是console.log("1" + 1); 再按照都是基本数据类型来算，结果就是"11"

eg5:console.log([1,2] + {n:1}); 结果为？

分析：数组[1,2]调用 valueOf()， [1,2].valueOf(); 结果为[1,2],没有得到基本数据类型，就继续调用toString(); 就是[1,2].toString();结果为"1,2"得到了基本数据类型
console.log([1,2].valueOf());  //[1, 2]
console.log([1,2].toString()); //"1,2"
对象{n:1}重复上面操作：
console.log(({n:1}).valueOf());  //{n: 1}
console.log(({n:1}).toString()); //"[object Object]"
注意：这里要给对象{n:1}外面加()包起来，不然有的浏览器版本可能会认为{ }是一个代码块而报错。

最终{n:1}得到基本数据类型"[object Object]"，

结果就是：console.log("1,2" + "[object Object]");

最后得到："1,2[object Object]"

eg6:如果对象调用 valueOf() 和 toString()都转换得不到原始类型，就会报错

var obj = {
    valueOf:function(){
        return this;
    },
    toString:function(){
        return this;
    }
}
console.log(obj + 1);

分析：obj对象不管调用 valueOf() 和 toString()得到的都是一个对象，进行 + 时就会报错

翻译就是：对象不能转换为原始值（基本数据类型）

JS加法问题

猜你喜欢