类型转换练习题

isNaN(parseInt(new Date())) + Number([1]) + typeof undefined

@1. parseInt(new Date()) --> 时间对象转为字符串:调用其内置方法Symbol.toPrimitive,传参‘default’,得到字符串:"Fri Jul 23 2021 15:42:12 GMT+0800 (中国标准时间)"

image.png

@2. parseInt("Fri Jul 23 2021 15:42:12 GMT+0800 (中国标准时间)") --> NaN
@3. isNaN(NaN) --> true
@4. true + Number([1]) -->[1]转为数字的步骤:c查看有无Symbol.toPrimitive属性(数组没有这个属性),没有的话就与valueOf查找原始值(结果是[1],不是原始值),再走toString()地到字符串'1',最后Number(’1‘) -->1
image.png

@5. true + 1 + typeof undefined --> 1+1+'undefined'
@6. 最后结果是’2undefined‘

!(!'Number(undefined)')

@1. !/!! 会存在其他类型转为布尔类型值
@2. 'Number(undefined)'转为布尔类型是 true
@3. !!true --> true

parseFloat('1.6px') + parseInt('1.2px') + typeof parseInt(null)

@1. parseFloat('1.6px') --> 1.6
@2. parseInt('1.2px') -->1
@3. typeof parseInt(null) --> parseInt(null) --> 0
@4. typeof 0 --> 'number'
@5. 1.6 + 1 + 'number' --> '2.6number'

Boolean(Number('')) + !isNaN(Number(null)) + Boolean('parseInt([])') + typeof !(null)

@1. Boolean(Number('')) -->Number('')=0 --> Boolean(0) = false
@2. !isNaN(Number(null)) -->Number(null) == 0 --> !isNaN(0) = true
@3. Boolean('parseInt([])') --> true
@4. typeof !(null) -->!(null):null转成布尔类型是false --> !false = true --> typeof true = 'boolean'
@5. false + true + true + 'boolean' = '2boolean'
@6. 注意:parseInt和Number的处理机制不同,所以,parseIn([]) 与Number([]) 的结果也不通

image.png

把其他类型转为Number:https://www.jianshu.com/p/a36980234665

isNaN(Number(!!Number(parseInt('0.8'))))

@1. parseInt('0.8') --> 0
@2. Number(0) --> 0
@3. !!0 --> false
@4. Number(false) --> 0
@5. isNaN(0) --> false

6

!typeof parseFloat('0')

@1. parseFloat('0') --> 0
@2. typeof 0 --> 'number'
(typeof xxx :结果一定是字符串;
typeof 0 结果是 字符串number --> 'number';
typeof '1' --> 'string';
typeof {} --> '[object Object]')
@3. !'number' --> false


Number('') // 0
parseInt('') // NaN
image.png
16 + {}

@1. {}转为数字
@2. 先去检测有无Symbol.toPrimitive属性(经检测没有)
@3. 如没有再基于valueOf找原始值(经检测,不是原始值,是个对象)
@4. 再去调toString方法,结果是:‘[object Object]’
@5. 16 + ‘[object Object]’ :到这一步后,已经变成字符串拼接
@6. 最后结果‘16[object Object]’

image.png

{} + 16

结果是16,在对象的左边,没有其他操作(例如声明变量接受值等)此时浏览器是把当前操作分解成为两部分"{}代码块"和”+1 “,两部分之间没有关系息,所以结果是1
但凡用()包一下都不是这个结果


image.png
var n = 6
console.log((n++) + n-- + 5 + --n + --n)
console.log(n)

回忆下基础知识:

  • i++ 和 ++i 都是自身基础累加1
    • i=1
      5+(i++) = ?
      i = ?
      i++ 是先拿原始值运算,运算完成后再自身累加1
      所以:5 + 1(5加完1后,i累加1 变成2) = 6
    • i=1
      5+(++i) = ?
      i = ?
      ++i 是自身先累加1,拿累加后的结果再进行运算
      5 + 2(i自身先累加1,再进行运算) = 7
  • i++ 和 i + = 1 / i = i + 1 的区别
    • i = '1' ;如果是字符串1
      i++ 等于 2 ; '++' 一定是数学运算
      i = i + 1 或者 i + = 1 等于 '11'
      i = i + 1 或者 i + = 1 可能会出现字符串拼接

解析:(n++) + n-- + 5 + --n + --n
@1、(n++):拿初始值6计算,这一步走完,n累加1,变成7
@2、6 + n-- :n已经变成7,所以是6+7,执行完这一步,n减一,变成6
@3、 6 + 7 + 5 + --n:--n先减一,再计算,所以n 变成5
@4、6 + 7 + 5 + 5 + --n:--n先减一,再计算,所以n 变成4
@5、6 + 7 + 5 + 5 + 4 = 27,n=4

var str = 'abc123'
var num = parseInt(str)
if (num == NaN) {
  alert(NaN)
} else if(num == 123) {
  alert(123)
} else if (typeof num == 'number') {
  alert('number')
} else {
  alert('str')
}

这个比较简单,parseInt([val]):[val]必须是字符串,parseInt会从左到右依次查找有效数字,遇到无效数字就停下不在查找
本题中,第一个就是字母a,所以停止查找,相当于一个有效数字都没有,所以结果是NaN
typeof NaN 结果是 'number'
所以alert 'number'
小知识点:alert出的值,都是转为字符串再输出的
alert(1) --> '1'

if(isNaN(NaN) == '') {
  console.log('zhangsan')
} else {
  console.log('lisi')
}

@1、isNaN(NaN) --> true
@2、true == ‘’ :需要两边都转成数字再比较
@3、true --> 1 转成数字是1
@4、‘’ --> 转成数字是0
@5、 1== 0 条件不成立,所以输出‘lisi’
相关链接:https://www.jianshu.com/p/eb2c41d0bbea

/ var a = ?
if (a == 1 && a == 2 && a == 3) {
  console.log('ok')
}

a 等于什么,下边的判断才会成立?
分析:
@1、 如果数据类型转换比较熟悉,那么看到'==' 比较,想到[类型转换]。
@2、"=="比较时的互换规则: https://www.jianshu.com/p/eb2c41d0bbea
@3、如果a是字符串或者数字 那么a就是一个固定值,条件不成立
@4、所以只能a是个对象,因为对象转数字的流程是:
Symbol.toPrimitive --> valueOf() --> toString
把其他数据类型转型为Number:
https://www.jianshu.com/p/a36980234665
@5、我们就可以通过重写对象的Symbol.toPrimitive / valueOf / toString中的任何一个属性 来达到想要的效果

先来重写对象的Symbol.toPrimitive(普通对象并没有内置Symbol.toPrimitive属性,但是可以重写)

var a = {
  i : 0,
  [Symbol.toPrimitive]() {
      return  ++this.i
  }
}
if (a == 1 && a == 2 && a == 3) {
  console.log('ok')
}
image.png

已知对象转数字的流程,所以重写Symbol.toPrimitive/valueOf/toString,结果是一样的

image.png

image.png

image.png

再看一个类似的解法

var a = [1,2,3]
a.toString = a.shift
if (a == 1 && a == 2 && a == 3) {
  console.log('ok')
}
image.png

其实和上边是同一个原理,通过重写toString来实现
a每次调toString的时候,就把a数字的第一个删掉并且返回.....

以上都是基于类型转换实现的,下边再从另一个方向分析一下

@1、声明a变量是在全局上下文中,而且是基于var处理的,此时可以想到['GO' --> window]
堆栈内存及栈结构:https://www.jianshu.com/p/2ef9f7983907
@2、所以我们使用的a是window的属性
@3、所以我们要用a的时候是从window下取出的,此时可以联想到对象数据劫持:Object.defineProperty
@4、 当劫持window下的a的时候,会触发getter函数,此时在getter函数中返回我们想要的值

var i =0
Object.defineProperty(window, 'a' ,{
  // 获取window中a属性的值,会触发getter函数
  get() {
    return ++i
  }
})
if (a == 1 && a == 2 && a == 3) {
  console.log('ok')
}
image.png

’‘

实现方法也不止这几种,后续再补充吧

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,242评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,769评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,484评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,133评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,007评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,080评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,496评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,190评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,464评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,549评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,330评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,205评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,567评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,889评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,160评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,475评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,650评论 2 335

推荐阅读更多精彩内容