再讀阮一峰的js入門的強制轉換部分


神奇的傳送門 書籍


1. 簡介梳星、基本語法基本沒啥問題,和以前的認知相同

2. 強制轉換 知識

主要指使用Number前域、StringBoolean三個構造函數(shù),手動將各種類型的值匿垄,轉換成數(shù)字、字符串或者布爾值归粉。

2.1 Number()函數(shù)

例如

//數(shù)值還是數(shù)值
Number(42)//42
//字符串 能全轉 才能全轉
Number('42') //42
//空字符串轉為0
Number(' ')//0
// 布爾值:true 轉成1椿疗,false 轉成0
Number(' true')//1
Number(' false')//0
// undefined:轉成 NaN
Number(undefined) // NaN
// null:轉成0
Number(null) // 0

Number()很嚴格,比parseInt()嚴格糠悼。

parseInt('42 cats') // 42
Number('42 cats') // NaN 只要有一個不能轉的字符就是NaN

Number函數(shù)會自動過濾一個字符串前導和后綴的空格。

Number('\t\v\r12.34\n') // 12.34

分割線強力來襲 ~~~~~~~~~~~~~~~


  • 強調一下對象的轉換規(guī)則
    簡單的規(guī)則是 ***簡單的規(guī)則是铝条,Number方法的參數(shù)是對象時席噩,將返回NaN班缰,除非是包含單個數(shù)值的數(shù)組班挖。
    舉例:
Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) // 5

接下來了解一下Number()背后的原理。哇擦嘞,以前真是不注意這些東西给梅,菜雞一枚啊双揪。

1、調用對象自身的valueOf方法渔期。如果返回原始類型的值渴邦,則直接對該值使用Number函數(shù)拘哨,不再進行后續(xù)步
驟。
2瓮床、如果valueOf方法返回的還是對象,則改為調用對象自身的toString方法产镐。如果toString方法返回原始類型的值,則對該值使用Number函數(shù)癣亚,不再進行后續(xù)步驟。
3街州、如果toString方法返回的是對象绰咽,就報錯。

原理不好理解取募,上栗子

var obj = {x: 1};
Number(obj) // NaN

// 等同于
if (typeof obj.valueOf() === 'object') {
  Number(obj.toString());
} else {
  Number(obj.valueOf());
}

上面的代碼意思是:Number函數(shù)接收到了obj,先調用obj.valueOf()方法斗忌,判斷是不是object,結果返回對象自身旺聚,于是,繼續(xù)調用obj.toString方法砰粹,這時返回字符串[object Object],對這個字符串使用Number函數(shù)弄痹,必然得到NaN

默認情況下嵌器,對象的valueOf()方法總是會返回對象自身,所以一般會調用對象的toString()方法爽航,如果toString()方法乾忱,返回對象的類型字符串(比如[object Object])历极,那么Number(),結果就是NaN执解;

Number({}) // NaN

如果toString()方法返回不是原始類型的值,就報錯(這句話的另一層意思也就是toString()方法被重寫了啊)

依然上栗子
obj對象重寫了兩個方法,注意 toString()方法返回的又是一個對象
報的錯 TypeError: Cannot convert object to primitive value

var obj = {
  valueOf: function () {
    return {};
  },
  toString: function () {
    return {};
  }
};

Number(obj)
// TypeError: Cannot convert object to primitive value

2.2 String()函數(shù)

使用String函數(shù)右蕊,可以將任意類型的值轉化成字符串吮螺。轉換規(guī)則如下。

    1. 原始數(shù)據類型轉換

數(shù)值:轉為相應的字符串鸠补。
字符串:轉換后還是原來的值。
布爾值:true轉為"true"规惰,false轉為"false"泉蝌。
undefined:轉為"undefined"。
null:轉為"null"勋陪。

String(123) // "123"
String('abc') // "abc"
String(true) // "true"
String(undefined) // "undefined"
String(null) // "null"
    1. 對象的轉換
      String方法的參數(shù)如果是對象,返回一個類型字符串寒锚;如果是數(shù)組违孝,返回該數(shù)組的字符串形式。
String({a: 1}) // "[object Object]"
String([1, 2, 3]) // "1,2,3"

背后的原理基本與Number()相同等浊,只是方法的調用相反

1、先調用對象自身的toString方法筹燕。如果返回原始類型的值衅鹿,則對該值使用String函數(shù)过咬,不再進行以下步驟。
2泵三、 如果toString方法返回的是對象衔掸,再調用原對象的valueOf方法。如果valueOf方法返回原始類型的值敞映,則對該值使用String函數(shù),不再進行以下步驟捷犹。
3冕末、如果valueOf方法返回的是對象,就報錯档桃。

String({a: 1})
// "[object Object]"

// 等同于

String({a: 1}.toString())
// "[object Object]"

上面代碼先調用對象的toString方法,發(fā)現(xiàn)返回的是字符串[object Object]销凑,就不再調用valueOf方法了仅炊。

如果toString法和valueOf方法,返回的都是對象抚垄,就會報錯。

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

String(obj)
// TypeError: Cannot convert object to primitive value

2.3 Boolean()

除了以下六個值的轉換結果為false桐经,其他的值全部為true浙滤。

undefined
null
-0
0或+0
NaN
' '(空字符串)

Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean('') // false
  • 注意一下
    注意,所有對象(包括空對象)的轉換結果都是true纺腊,甚至連false對應的布爾對象new Boolean(false)也是true茎芭。
Boolean({}) // true
Boolean([]) // true
Boolean(new Boolean(false)) // true
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末梅桩,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子宿百,更是在濱河造成了極大的恐慌洪添,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件外臂,死亡現(xiàn)場離奇詭異律胀,居然都是意外死亡貌矿,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進店門逛漫,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人克握,你說我怎么就攤上這事枷踏。” “怎么了旭蠕?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵掏熬,是天一觀的道長。 經常有香客問我旗芬,道長,這世上最難降的妖魔是什么疮丛? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮婉烟,結果婚禮上,老公的妹妹穿的比我還像新娘洞辣。我一直安慰自己昙衅,他們只是感情好,可當我...
    茶點故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布而涉。 她就那樣靜靜地躺著,像睡著了一般材原。 火紅的嫁衣襯著肌膚如雪季眷。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天子刮,我揣著相機與錄音威酒,去河邊找鬼挺峡。 笑死,一個胖子當著我的面吹牛尤仍,可吹牛的內容都是我干的病线。 我是一名探鬼主播,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼绑莺,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了纺裁?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤栋豫,失蹤者是張志新(化名)和其女友劉穎谚殊,沒想到半個月后丧鸯,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體嫩絮,經...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡剿干,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了杠步。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡幽歼,死狀恐怖谬盐,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤泣刹,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站外冀,受9級特大地震影響掀泳,放射性物質發(fā)生泄漏。R本人自食惡果不足惜员舵,卻給世界環(huán)境...
    茶點故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望庄拇。 院中可真熱鬧,春花似錦措近、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽擒权。三九已至袜茧,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間纳鼎,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工贱鄙, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留姨谷,地道東北人。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓瞎颗,卻偏偏與公主長得像捌议,于是被迫代替她去往敵國和親哼拔。 傳聞我的和親對象是個殘疾皇子瓣颅,可洞房花燭夜當晚...
    茶點故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內容

  • 第5章 引用類型(返回首頁) 本章內容 使用對象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學一百閱讀 3,233評論 0 4
  • 官方中文版原文鏈接 感謝社區(qū)中各位的大力支持檬姥,譯者再次奉上一點點福利:阿里云產品券,享受所有官網優(yōu)惠健民,并抽取幸運大...
    HetfieldJoe閱讀 2,516評論 1 17
  • 強制轉換 強制轉換主要指使用Number贫贝、String和Boolean三個構造函數(shù),手動將各種類型的值,轉換成數(shù)字...
    燈火闌珊Zone閱讀 401評論 0 3
  • 和孩子一起悦陋,打開了視覺腦筑辨,便打開了人類創(chuàng)造性的源泉——請看一下你的周圍,目之所及棍辕,無論大小,任何一件人造的事物楚昭,都...
    簡悅直播教練恬源閱讀 170評論 0 1
  • 回渝 晨風催醒半夢人 攜妻帶女趕路歡 跨水越嶺赴山城 復品冬霧嘉陵畔
    闡釋逐暗閱讀 205評論 0 1