JS - 高級(jí)技巧(1)

安全數(shù)據(jù)類型監(jiān)測(cè)

typeof : 由于一些無法預(yù)知的情況剥纷, 用這種方式會(huì)得到不靠譜的結(jié)果。
instanceof : 必須在同一全局執(zhí)行環(huán)境 [高程:596]

Object.prototype.toString.call(d).slice(8, -1);

作用域安全的構(gòu)造函數(shù)

構(gòu)造函數(shù)就是使用new操作符調(diào)用的函數(shù)伟姐。當(dāng)使用new時(shí),構(gòu)造函數(shù)內(nèi)用到的this會(huì)指向新創(chuàng)建的對(duì)象實(shí)例。
但當(dāng)沒用使用new操作符調(diào)用構(gòu)造函數(shù)時(shí)付魔,由于該this對(duì)象是在運(yùn)行時(shí)綁定的,所以直接調(diào)用 Person()飞蹂,this會(huì)映射到window上几苍,導(dǎo)致錯(cuò)誤對(duì)象屬性的意外增加。

function Person(name, age) {
    this.name = name;
    this.age = age;
}

var p1 = new Person('sunorry', 18);
var p2 = Person('machao', 28); 
window.age; // 28 
p2.age; // Error

原本只對(duì) Person 實(shí)例的三個(gè)屬性被加到 window 對(duì)象上陈哑,因?yàn)?strong>構(gòu)造函數(shù)是作為普通函數(shù)調(diào)用的妻坝,忽略了new 操作符。由于 windowname 屬性適用于識(shí)別鏈接目標(biāo)和 frame 的惊窖,所以這里對(duì)該屬性的偶然覆蓋可能會(huì)導(dǎo)致該頁面上出現(xiàn)錯(cuò)誤刽宪。
實(shí)現(xiàn)了上面的模式后,你就鎖定了可以調(diào)用的構(gòu)造函數(shù)的環(huán)境爬坑。如果你使用構(gòu)造函數(shù)竊取模式的繼承且不使用原型鏈纠屋,那么這個(gè)繼承可能被破壞。

function Polygon(sides) {
    if(this instanceof Polygon) {
        this.sides = sides;
        this.getArea = function() {
            return 0;
        }
    } else {
        return new Polygon(sides);
    }
}

function Rectangle(width, height) {
    Polygon.call(this, 2);
    this.width = width;
    this.height = height;
    this.getArea = function() {
        return this.width * this.height;
    };
}

var rect = new Rectangle(5, 10);
console.log(rect.sides); //undefiend

Polygon 構(gòu)造函數(shù)是作用域安全的盾计,然而 Rectangle 構(gòu)造函數(shù)則不是售担。新創(chuàng)建個(gè) Rectangle 實(shí)例之后趋惨,這個(gè)實(shí)例應(yīng)該通過 Polygon.call()來繼承 Polygon 的 sildes 屬性仅胞。但是短条,由于 Polygon 是構(gòu)造函數(shù)是作用域安全的恭朗, this對(duì)象并非 Polygon 的實(shí)例,所以會(huì)創(chuàng)建并返回一個(gè)新的 Polygon 對(duì)象哥攘。 Rectangle 構(gòu)造函數(shù)中的 this 并沒用得到增長(zhǎng)剖煌,同時(shí) Polygon.call() 返回的值也沒有得到,所以 Rectangle 實(shí)例中就不會(huì)有 sides 屬性逝淹。

如果構(gòu)造函數(shù)竊取結(jié)合使用原型鏈或者寄生組合則可以解決這個(gè)問題耕姊。
new 之前加上

Rectangle.prototype = new Rolygon();

一個(gè) Rectangle 實(shí)例也同時(shí)是一個(gè) Polygon 實(shí)例,所以 Polygon.call() 會(huì)照愿意執(zhí)行栅葡,做種為 Rectangle 實(shí)例添加了 sides 屬性茉兰。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市欣簇,隨后出現(xiàn)的幾起案子规脸,更是在濱河造成了極大的恐慌,老刑警劉巖熊咽,帶你破解...
    沈念sama閱讀 207,113評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件莫鸭,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡横殴,警方通過查閱死者的電腦和手機(jī)被因,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,644評(píng)論 2 381
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來衫仑,“玉大人氏身,你說我怎么就攤上這事』蟪耄” “怎么了?”我有些...
    開封第一講書人閱讀 153,340評(píng)論 0 344
  • 文/不壞的土叔 我叫張陵航徙,是天一觀的道長(zhǎng)如贷。 經(jīng)常有香客問我,道長(zhǎng)到踏,這世上最難降的妖魔是什么杠袱? 我笑而不...
    開封第一講書人閱讀 55,449評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮窝稿,結(jié)果婚禮上楣富,老公的妹妹穿的比我還像新娘。我一直安慰自己伴榔,他們只是感情好纹蝴,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,445評(píng)論 5 374
  • 文/花漫 我一把揭開白布庄萎。 她就那樣靜靜地躺著,像睡著了一般塘安。 火紅的嫁衣襯著肌膚如雪糠涛。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,166評(píng)論 1 284
  • 那天兼犯,我揣著相機(jī)與錄音忍捡,去河邊找鬼。 笑死切黔,一個(gè)胖子當(dāng)著我的面吹牛砸脊,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播纬霞,決...
    沈念sama閱讀 38,442評(píng)論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼凌埂,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了险领?” 一聲冷哼從身側(cè)響起侨舆,我...
    開封第一講書人閱讀 37,105評(píng)論 0 261
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎绢陌,沒想到半個(gè)月后挨下,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,601評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡脐湾,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,066評(píng)論 2 325
  • 正文 我和宋清朗相戀三年臭笆,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片秤掌。...
    茶點(diǎn)故事閱讀 38,161評(píng)論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡愁铺,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出闻鉴,到底是詐尸還是另有隱情茵乱,我是刑警寧澤,帶...
    沈念sama閱讀 33,792評(píng)論 4 323
  • 正文 年R本政府宣布孟岛,位于F島的核電站瓶竭,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏渠羞。R本人自食惡果不足惜斤贰,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,351評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望次询。 院中可真熱鬧荧恍,春花似錦、人聲如沸屯吊。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,352評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至授艰,卻和暖如春辨嗽,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背淮腾。 一陣腳步聲響...
    開封第一講書人閱讀 31,584評(píng)論 1 261
  • 我被黑心中介騙來泰國(guó)打工糟需, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人谷朝。 一個(gè)月前我還...
    沈念sama閱讀 45,618評(píng)論 2 355
  • 正文 我出身青樓洲押,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親圆凰。 傳聞我的和親對(duì)象是個(gè)殘疾皇子杈帐,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,916評(píng)論 2 344

推薦閱讀更多精彩內(nèi)容

  • 1,javascript 基礎(chǔ)知識(shí) Array對(duì)象 Array對(duì)象屬性 Arrray對(duì)象方法 Date對(duì)象 Dat...
    Yuann閱讀 891評(píng)論 0 1
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn)专钉,斷路器挑童,智...
    卡卡羅2017閱讀 134,601評(píng)論 18 139
  • 第5章 引用類型(返回首頁) 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學(xué)一百閱讀 3,212評(píng)論 0 4
  • 現(xiàn)在越來越多暢銷爆點(diǎn)的非虛構(gòu)類書籍你甚至不需要通讀一遍——看目錄挑些重點(diǎn)或者只要讀每章的前五頁加最後五頁——就幾乎...
    mizzzhou閱讀 1,185評(píng)論 2 1
  • 有人曾說站叼,喜歡一個(gè)人的感覺,就如微信上的對(duì)方正在輸入功能菇民。 你有過這樣的狀態(tài)嗎尽楔?在等待一個(gè)人的回復(fù)消息時(shí),如果對(duì)話...
    茗藝堂閱讀 289評(píng)論 0 0