classnames 是公司專案中使用較頻繁的乙個庫,因為能方便動態切換 class 名稱。
放下對比大家感受下~
<
的話是這個樣子:!-- before --
>
let clsname =
'conetnt'
if(showcontent)
else
if(needmargin) clsname +=
' add-margin'
return
/>
<
!-- 使用 classnames 後 --
>
return
/>又比如自己封裝的業務元件,呼叫方經常需要傳入自定義 class 類名,使用classnames
// 假設 clsname 為父元件傳入的自定義類名,可選
/>以上 classnames 可以根據 truly 值動態選擇拼接 class 名稱,在前端開發中是很方便的。
使用多了逐漸對classnames產生了好奇:它的內部是如何執行的??
github 上檢視原始碼後也從中學到了一些東西 ? ,分享給大家:
// 儲存 object 的 hasownproperty 方法引用
var hasown =
.hasownproperty
function
classnames()
else
if(array.
isarray
(arg)
&& arg.length)
else
if(argtype ===
'object'
)else}}
}// 將 classes 元素通過 ' ' 空格拼接後返回,即拼接後的 class 名稱
return classes.
join
(' '
)}
方法測試截圖:了解原始碼內部執行機制,能讓我們在使用的時候明確結果是如何產生的,同時哪些使用方法是不適合的等等~ ?
– end –
原始碼學習 ArrayList的擴容原始碼分析
原始碼如下 下面是arraylist的擴容機制 arraylist的擴容機制提高了效能,如果每次只擴充乙個,那麼頻繁的插入會導致頻繁的拷貝,降低效能,而arraylist的擴容機制避免了這種情況。如有必要,增加此arraylist例項的容量,以確保它至少能容納元素的數量 param mincapac...
PicoContainer原始碼學習
介紹下自己,我叫stef wu,是個菜鳥,現在在easyjf團隊學習,得到了大峽等人的熱情幫助。本序列文章是以前在學習研究picocontainer時所記錄下來的,希望借本文,能和正在學習pico新手或者研究pico的高手一起交流學習。由於我水平不好,而且是真實的從頭到尾的記錄,所以其中,特別是前面...
PicoContainer原始碼學習
介紹下自己,我叫stef wu,是個菜鳥,現在在easyjf團隊學習,得到了大峽等人的熱情幫助。本序列文章是以前在學習研究picocontainer時所記錄下來的,希望借本文,能和正在學習pico新手或者研究pico的高手一起交流學習。由於我水平不好,而且是真實的從頭到尾的記錄,所以其中,特別是前面...