关于数据类型转换的几道经典题目
首先我先给大家展示几道题目,大家尝试做一下。后面会有讲解,
题目:
question:
//题目1 let result = 100 + true + 21.1 + null + undefined + "Tencent" + [] + null + 9 + false; console.log(result); //题目2 console.log([]==false); //题目3 console.log(![]==false);
answer:
题目解析:
- 题目1 遇到这种运算先找 + 加号两边的字符串还有对象 会按照字符串拼接处理,字符串我们很好理解,但是对象是为什么呢? 因为遇到对象会先转换为字符串然后转为数字(会经历valueOf转为原始值、toString方法)
- 题目2:==作比较规则参照下面的总结(此处是将==两边的内容转为数字进行比较)0==0 --> true
- 题目3:==的优先级比较低,肯定是先算左边 ![] 然后与后面进行比较,[]转为布尔值为true 取反 false false==false
易错点:[] 空数组转为字符串为空字符串'',转为数字(会经历转为空字符串的过程)为0
JS当中的数据类型
1. 基本数据类型: number string boolean null undefined symbol bigint
2. 引用数据类型:object function(解释一下:我们一般会把function归于object,但是也可以把这个归于单独一个类型,因为typeof 检测出来确实是function)
接下来我将介绍几种数据类型转换的规则 (牢记重点):以后关于数据类型的问题肯定能够得心应手,一定手到擒来。
1. 任何数据类型转为Number类型
null--->0
任何数 + undefined =NaN
[]-->0(原因:对象转为数字先将数字转为字符串再转为数字 []-->''-->0)
对与Number() 将字符串转为数字时 有任何非有效数字就会转为 NaN ,可以识别第一个小数点,但是出现第二个就会转为NaN
对于parseInt 整数 ,parseFloat 小数 将字符串转为数字时 他是从左到右依次查找有效数字字符,直到遇到非有效数字字符停止查找(一个一个的找)
2. 任何数据类型转为String类型
3. 在==比较的过程中,数据转换的规则
4. 任何数据类型转为Boolean类型
练习题:
接下来的几道题大家可以练练手
1. a为什么值时可以输出OK
解析:以下有几种解决方案,每种解题方案都是不同的思路,供大家参考。
第一种思想:
- if的条件是 == 数字,所以我们要想到把a转换为数字
- 对象转换为数字的时候会经历 对象-->字符串-->数字 对象转换为字符串:valueof( ) tostring()
- a.toString 会调用 0bject.prototype.toString() 但这个是检测数据类型的
- 所以要想到自己重写toString()
var a = { i: 0, toString() { return ++this.i; }, }; if (a == 1 && a == 2 && a == 3) { console.log("OK"); }
第二种思想:
- vue2.0 MVVM原理
- 给window添加一个属性 触发get拦截器(数据劫持)
var i = 0; Object.defineProperty(window, "a", { get() { return ++i; }, }); if (a == 1 && a == 2 && a == 3) { console.log("OK"); }
第三种思想:
var a = [1, 2, 3]; a.join = a.shift; //join将数组转换为字符串 shift删除数组的第一项返回删除的内容 if (a == 1 && a == 2 && a == 3) { console.log("OK"); }
let arr = [10.18, 0, 10, 25, 23]; arr = arr.map(parseInt); console.log(arr);
答案:[10,NaN,2,2,11]
分析:我们先看到这道题的时候首先要知道两个知识点 map 以及 parseInt用法
+ map : map里面是一个回调函数,函数有两个参数 分别是当前的循环项以及对应的索引值,题是将这个函数替换成了parseInt
arr = arr.map((item,index)=>{ return item * 10; });
+ parseInt
解题过程: