天天看點

當新手使用JS庫遇到問題怎麼辦

見标題,知其意。在做網站時候,其實我們會用很多js庫,網絡上流行的和公司自己封裝的,這些東西都很好用,但是或多或少的有些bug或者有一些缺陷,即使真的很完善,但也可能達不到自己特定的一些需求。是以遇到問題,是很正常的。但是為什麼要說是新手遇到問題呢?這就是因為,有些問題,工作幾年的攻城獅,輕而易舉的就解決了,是以對于他們這些根本不是問題,或者對于他們這些就是私人定制而已。

其實我也是這樣走過來的,如果叫我自己完全封裝一個非常強悍的js庫,我肯定是沒有辦法做的,不是因為技術,而是經驗不夠,因為考慮的需要非常多的因素。就如orm一樣,我們會用非常成熟的,而不會自己去封裝。

不說這麼多了,下面開始講講如何解決我們在生産環境當中遇到問題怎麼辦?當時我這裡也要為大家講一下前提條件,即準入知識,隻有這樣大家才有能力去解決問題的。

一、準入知識

a) jquery&js

這個兩個基本的必須得懂,具體的可以去http://www.w3school.com.cn學習

b) js面向對象

參見:http://www.cnblogs.com/gaojun/archive/2013/10/24/3386552.html該部落客也是參見《javascript 進階程式設計》這本說的,是以該博文對面向對象講的很到位,有些我沒有注意到過。

c) jquery&js擴充方法的實作

其實大家應該都遇到過,通過前台腳本,去除字元串前後,jquery和js,都沒有公共的方法,我也不知道是為什麼,還說所的就是替換字元串的,盡然預設隻替換第一個比對的。這裡也有現成的博文,供大家閱讀

jquery: http://www.cnblogs.com/xcj26/p/3345556.html

js: http://www.cnblogs.com/kissdodog/p/3386480.html

這兩篇文章都很不錯,特别是jquery這篇讓我也明白了一些以前不知道的。

這裡小小的總結下,請各位讀者按照a,b,c的順序進行知識準備,其實這個就是一個技術的升華,其實這些都沒有多難,隻是我們以前沒有了解過。是以現在我們有必要把知識掌握了友善以後工作當中使用

二、讀懂别人的js庫中的代碼

這個很重要,你連别人的代碼都讀不懂,談什麼修改别人的代碼或者擴充别人的代碼。當時我相信,隻要大家達到了準入知識,讀一些不是非常複雜的代碼,我相信沒有多大的我問題。是以掌握基礎是關鍵,來不得半點虛假。

我們讀别人的代碼要膽大心細,大家都是寫程式的,js庫也是人寫出來的,其他比我們強,還是要按js文法來實作,隻是比我們寫作水準高而已。就如我們聯考作文拿不到滿分,但是不至于連滿分作文都看不懂了吧。要是這樣的話我就為你捉急了啊。

三、嘗試修改js庫中的代碼

終于到了這個環節了,但是我要強調一下,不要輕易去修改網絡上流行的代碼。這裡本來就是将如何修改代碼,但是為什麼又不要輕易去修改呢?大家不要疑惑,不讓修改是考慮到,這些js庫,有非常專業的團隊在維護,代碼嚴謹性非常高,如果你改了,很可能影響整個js庫的使用。即使真是一個bug或者需要個人定制功能,建議重新實作和擴充。這樣有利于js庫的更新和自己實作的代碼可以獨立未獲。如果你真的修改了js庫的代碼,請記住,一定要記錄到文檔,否者更新了js庫,你所修改的代碼就會被覆寫,你做工作就白費了。通常慣例,也是允許修改庫代碼的,是以大家要謹記。

這裡我就以我在工作當中遇到的一個例子,來給大家講解。

當新手使用JS庫遇到問題怎麼辦

看到右側有一個本地儲存的提示資訊了吧,很多人都想把這個資訊給去除,官方也提供的關閉參數,但是無法達到我們預期不提示的效果,但是把自動儲存間隔時間設計很長時間,似乎就能達到預期效果,但是這個方法确實是不太合理的。

當新手使用JS庫遇到問題怎麼辦

首先我們是要找到這段提示的出處

當新手使用JS庫遇到問題怎麼辦

通過上圖我們看到,其實這個就是一個配置檔案,如何使用,我們可以靠猜,首先我們看到這個值對應的鍵名是success,一看這個,就知道很難找的,但是我們又看到autosave這個節點名稱,我們想都不想,這個節點肯定會出現在代碼裡。我們就拿這個去搜尋,看下兩張圖。

當新手使用JS庫遇到問題怎麼辦
當新手使用JS庫遇到問題怎麼辦

這是我找到最可能是導緻提示資訊出現的兩段代碼。我們可以細細讀一下這些兩段代碼,看看各是什麼用途

這裡可以讓我們知道,第二張圖,其實就是為了讓自動儲存允許起來,是以我們放到第一張圖。

當新手使用JS庫遇到問題怎麼辦

我們發現了這關鍵字,有沒有印象,這個關鍵字是在哪裡見過,對這個就是配置檔案裡的,我們開始的時候就說,設定間隔時間起效過,設定啟用自動儲存這個參數卻不見作用,這樣我們所搜下關鍵字enableautosave,整個庫裡面都找不到。這個說明這個功能根本沒有實作。

我們把這個産生在代碼裡使用上級可以了。結果如下圖:

當新手使用JS庫遇到問題怎麼辦

總結,這裡隻是為了實作效果,其他地方的代碼我沒有去深究,但是我想這樣修改應該不會影響其他地方。我認為修改别人的代碼不能,難的是修改後不會導緻新的問題參數。再次強調,不要輕易跟我一樣再代碼裡做修改。如果能找到代碼外的實作方式是最好的。

作者:z-albert

來源:51cto

繼續閱讀