資訊專欄INFORMATION COLUMN
摘要：轉(zhuǎn)碼后，我們的靜態(tài)屬性同樣掛載到了這個(gè)新的上，這是的操作，無解，它已經(jīng)不是原來的了。這就導(dǎo)致我們?cè)诶飳拥闹腥フ{(diào)用等靜態(tài)屬性就會(huì)報(bào)。所以盡可能不使用靜態(tài)屬性，而是直接置頂用變量代替。
react開發(fā)的時(shí)候，引入熱加載，用了修飾器的引入方式，發(fā)現(xiàn)了一個(gè)很有意思的問題，網(wǎng)上并沒有相關(guān)文章，所以拋出來探討下。
一段很簡單的測(cè)試代碼。但是經(jīng)過babel編碼后，變得很有意思。假設(shè)編碼成es2016，那么會(huì)是怎樣的呢。
因?yàn)閑s6支持static靜態(tài)方法，但不支持靜態(tài)屬性，導(dǎo)致屬性被編碼成CS.myName="kkk"
but 關(guān)鍵的地方來了。。因?yàn)槲覀円肓薂hot。。一切變得有意思，看看源碼它做了什么
hot給Component包裹了幾層，返回了一個(gè)新的component。。
重點(diǎn)來了。。。這就導(dǎo)致了一個(gè)很有意思的問題。
babel轉(zhuǎn)碼后，我們的靜態(tài)屬性同樣掛載到了這個(gè)新的component上，這是babel的操作，無解，它已經(jīng)不是原來的component了。 這就導(dǎo)致我們?cè)诶飳拥腸omponent中去調(diào)用 Cs.myName等靜態(tài)屬性就會(huì)報(bào)undefined。所以盡可能不使用靜態(tài)屬性，而是直接置頂用const變量代替。
不過幸好的是，靜態(tài)方法是直接掛載到里面（原來）的component上的。所以我們能夠正常訪問得到，如Cs.show。
但同樣會(huì)引發(fā)一個(gè)好奇，如果我轉(zhuǎn)化成es5,不支持靜態(tài)方法的話，那是不是也會(huì)導(dǎo)致靜態(tài)方法丟失的問題呢。。為此我特意做了個(gè)試驗(yàn)。。
當(dāng)當(dāng)當(dāng)。。。
忽略波浪線，是eslint報(bào)錯(cuò)。。。
發(fā)現(xiàn)沒。。即便是es2015。轉(zhuǎn)碼后屬性還是外層，不過方法依然是在里層實(shí)現(xiàn)的。并沒有掛載的外層，_createClass這個(gè)方法做了處理的
我們定義的show和hide當(dāng)做staticProps傳進(jìn)去了。
總結(jié)了。。雖然是引入了@hot導(dǎo)致的問題，但還是盡量不要使用static定義屬性（方法沒問題）。。畢竟誰也不支持會(huì)不會(huì)有什么其他東東包裹了我們的組件。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/96227.html
摘要：虛擬機(jī)為了保證一個(gè)類的方法在多線程環(huán)境中被正確地加鎖同步。但啟動(dòng)類加載器不可能認(rèn)識(shí)這些代碼。實(shí)現(xiàn)模塊化熱部署的關(guān)鍵則是它的自定義類加載器機(jī)制的實(shí)現(xiàn)。 概念區(qū)分：加載、類加載、類加載器 類加載是一個(gè)過程。 加載（Loading）是類加載這一個(gè)過程的階段。 類加載器是ClassLoader類或其子類。 本文中的類的描述都包括了類和接口的可能性，因?yàn)槊總€(gè)Class文件都有可能代表J...
摘要：使用讓從打包文件中刪除未使用的導(dǎo)出項(xiàng)以減少文件大小。最后，用以下內(nèi)容替換的部分在命令行中運(yùn)行將以監(jiān)視模式啟動(dòng)，當(dāng)目錄中的文件更改時(shí)，它將重新編譯。這種轉(zhuǎn)換涉及三個(gè)單獨(dú)的加載器和庫在配置文件中為文件添加新規(guī)則。 webpack已成為現(xiàn)代Web開發(fā)中最重要的工具之一。它是一個(gè)用于JavaScript的模塊打包工具，但是它也可以轉(zhuǎn)換所有的前端資源，例如HTML和CSS，甚至是圖片。它可以讓你...
摘要：入門什么是官網(wǎng)介紹是一個(gè)模塊打包器。處理帶有依賴關(guān)系的模塊，生成一系列表示這些模塊的靜態(tài)資源。。我們?cè)诋?dāng)前項(xiàng)目根目錄下新建一個(gè)文件，為命令配置選項(xiàng)。引入生成的在瀏覽器中打開。我們刷新頁面，可以發(fā)現(xiàn)頁面發(fā)生了變化。 webpack 入門 1. 什么是webpack 官網(wǎng)介紹：webpack是一個(gè)模塊打包器。webpack 處理帶有依賴關(guān)系的模塊，生成一系列表示這些模塊的靜態(tài)資源。(web...
摘要：驗(yàn)證驗(yàn)證是連接階段的第一步，這一階段的目的是為了確保文件的字節(jié)流中包含的信息符合當(dāng)前虛擬機(jī)的要求，并且不會(huì)危害虛擬機(jī)自身的安全。字節(jié)碼驗(yàn)證通過數(shù)據(jù)流和控制流分析，確定程序語義是合法的符合邏輯的。 看過這篇文章，大廠面試你「雙親委派模型」，硬氣的說一句，你怕啥？ 讀該文章姿勢(shì) 打開手頭的 IDE，按照文章內(nèi)容及思路進(jìn)行代碼跟蹤與思考 手頭沒有 IDE，先收藏，回頭看 (萬一哪次面試問...
摘要：最終形成可以被虛擬機(jī)最直接使用的類型的過程就是虛擬機(jī)的類加載機(jī)制。即重寫一個(gè)類加載器的方法驗(yàn)證驗(yàn)證是連接階段的第一步，這一階段的目的是為了確保文件的字節(jié)流中包含的信息符合當(dāng)前虛擬機(jī)的要求，并且不會(huì)危害虛擬機(jī)自身的安全。 《深入理解Java虛擬機(jī)：JVM高級(jí)特性與最佳實(shí)踐（第二版》讀書筆記與常見相關(guān)面試題總結(jié) 本節(jié)常見面試題（推薦帶著問題閱讀，問題答案在文中都有提到）： 簡單說說類加載過...
閱讀 2159·2021-11-12 10:36
閱讀 1999·2021-11-09 09:49
閱讀 2696·2021-11-04 16:12
閱讀 1226·2021-10-09 09:57
閱讀 3308·2019-08-29 17:24
閱讀 1981·2019-08-29 15:12
閱讀 1367·2019-08-29 14:07
閱讀 1358·2019-08-29 12:53
