1.Zepto.js
創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比北安網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式北安網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋北安地區(qū)。費(fèi)用合理售后完善,十載實(shí)體公司更值得信賴。
描述:Zepto是一個(gè)輕量級的針對現(xiàn)代高級瀏覽器的JavaScript庫, 它與jquery有著類似的api。 如果你會用jquery,那么你也會用zepto。關(guān)于Zepto認(rèn)知我也是通過與一位騰訊朋友聊天的時(shí)候知道的,只作了些基礎(chǔ)的了解。
2.SUI Mobile
描述:SUI Mobile 是一套基于 Framework7 開發(fā)的UI庫。它非常輕量、精美,只需要引入我們的CDN文件就可以使用,并且能兼容到 iOS 6.0+ 和 Android 4.0+,非常適合開發(fā)跨平臺Web App。
用途:你也看到了,他是用于無線端的Web App的開發(fā)。
3.Node.Js
覺得自己寫的亂,那是好事,正因?yàn)檫@樣,說明你還有提升的空間
首先,通過你說的表述,我感覺,你覺得代碼亂,很大一部分是代碼書寫方式上的不統(tǒng)一,這個(gè)的話呢,其實(shí)也簡單,你可以使用eslint這樣的代碼規(guī)范校驗(yàn)工具,強(qiáng)制你們組寫成一致的代碼,另一種呢,其實(shí)就更看個(gè)人了,就是說,要寫盡量有意義的代碼,也就是說,你的變量的聲明,函數(shù)的聲明,都要讓人一眼能明白它是干嘛的。這樣的話,可讀性就好很多了。
還有一點(diǎn)需要注意的,就是代碼重構(gòu)方面的,就是單一職責(zé)的原則,一個(gè)函數(shù),只處理一件事情,一個(gè)文件只處理一類事情,一個(gè)類只代表某一種對象。如果你嚴(yán)格按照這種方式去寫代碼,我覺得就不會亂。
最后呢,你說不同的類庫之間風(fēng)格差異也很大,我覺得很正常啊,因?yàn)閷τ谀銇碚f,你是使用者,是不用關(guān)注類庫的內(nèi)部實(shí)現(xiàn)的呀。他內(nèi)部怎么實(shí)現(xiàn)跟你關(guān)系也不大,只要能用,好用就行。所以說,你們組員之間寫代碼要規(guī)范起來,跟類庫就不用規(guī)范了,他愛怎么寫怎么寫,跟你沒有關(guān)系,不過呢,有時(shí)候你可以去多閱讀下類庫的代碼,吸收一些經(jīng)驗(yàn)也不錯,加油。
推薦你一篇文章:javascript的一些命名約定,希望會對你有所幫助
1. JavaScript DOM 編程藝術(shù)
這本書作為被大家推薦的最多的前端入門書籍是有道理的。
他能真正讓大家了解dom腳本編程,或是說前端編程技術(shù)背后的思路和原則。
對于初學(xué)者來說,這本書沒有任何門檻,按部就班跟著書籍實(shí)例編寫代碼即可。
我們會知曉如何對瀏覽器元素操作和掌控,會學(xué)會如何實(shí)現(xiàn)簡單的頁面效果。
這種簡單易得的成就感是一個(gè)編程語言入門時(shí)最難能可貴的體驗(yàn)。
閱讀建議:
這本書雖然簡單,但是能讓人快速對前端產(chǎn)生興趣和成就感。
不過后續(xù)學(xué)習(xí)jquery的時(shí)候可能會產(chǎn)生挫敗感。原生js dom操作的成就感會被jquery便捷的API所徹底打敗。所以一定要恰當(dāng)?shù)恼{(diào)整心態(tài),轉(zhuǎn)換思維方式,正確認(rèn)識到j(luò)query和原生js分別的優(yōu)劣之處。
在熟練使用jquery后還能想起來翻看這本書,找到之前未曾發(fā)現(xiàn)的閃光點(diǎn),就是入門成功了。
2. JavsScript高級程序設(shè)計(jì)(第三版)
無論何時(shí),這都是學(xué)習(xí)js最好的書。
如果說其他的書都是在合適的階段會有不一般的體驗(yàn)。
這本書就是無論什么階段,都夠你感悟一番的。
當(dāng)你看完了市場上js相關(guān)(不包括框架類庫的最佳實(shí)踐類)的所有書籍。你再回去看這本書,也會發(fā)現(xiàn)其實(shí)95%的內(nèi)容早就寫在這本書里了,只不過你當(dāng)時(shí)等級不夠,根本沒有意識到。
這本書排版舒服,翻譯得體,內(nèi)容豐富,語言流暢。涵蓋了js語法(面向?qū)ο?,閉包作用域等),js使用(dom,bom,html5API),編程實(shí)踐(高階函數(shù),編碼規(guī)范)等程序員使用javascript時(shí)會遇到的大部分問題。
(今天在上海面試了一天。大部分很順利,只是有幾個(gè)比較偏的問題沒回答好。晚上回去之后一翻高程三,果然在里面都寫得明明白白的。不得不服。)
閱讀建議:
人們喜歡把他和犀牛書拿一起推薦,不過就我看來,他們完全不是一個(gè)可讀性上的。
一個(gè)是課本一個(gè)是字典。而且還是佶屈聱牙的字典。
所以無論何時(shí)我都會把高程三排在js推薦書籍的第一位。
3. 鋒利的jQuery
圖忘了拍了,就不補(bǔ)了。
這本書如果緊接著dom編程看,會如我我說的那樣瞬間摧毀你的小小的成就感。
因?yàn)檫@本工具書級別的書簡單暴力到不給你思考什么“平穩(wěn)退化”,“js動畫計(jì)時(shí)器”這些dom編程中提及的問題,就直接就甩出一大片簡單有效的jqueryAPI顛覆你的世界觀。
這本書是如此的易懂以至于看完之后瞬間就覺得自己能把web玩出一片花來了。
作為工具書級別的書,或是說學(xué)習(xí)jqueryAPI的書,這是首選。
閱讀建議:
熟悉jquery是每個(gè)前端必須要會的事。
只是不要被Jquery的便捷迷惑,而拋離原生js,把原生js貶得一文不值,否則后面會付出昂貴的代價(jià)。
4. 學(xué)習(xí)Javascript數(shù)據(jù)結(jié)構(gòu)與算法
這本書相對是一本冷門書。
為什么我會推薦他,是因?yàn)樗芙鉀Q每個(gè)半路出家的js程序員都曾思考過的一些問題:
1. 我們的數(shù)組Array這么強(qiáng)大,要棧Stack,隊(duì)列Queue這些功能少,半半拉拉的東西干什么呢?
2. 我們學(xué)的數(shù)據(jù)結(jié)構(gòu)搞來搞去好像也就那些玩意,為什么被大家這么推崇,還要分門別類討論呢?
所以這本書只是為何告訴你上面這些問題的答案:
1. 棧和隊(duì)列本來就沒有Array功能強(qiáng)。沒有Stack和Queue類只是因?yàn)镋S5不去實(shí)現(xiàn)它而已。作為一種相互之間存在一種或多種特定關(guān)系的數(shù)據(jù)集合,其存在意義是不應(yīng)該被其功能強(qiáng)大與否來決定的。
2. 數(shù)據(jù)結(jié)構(gòu)和編程語言無關(guān)。語言死了,他們會在下一門語言里重生。哪怕計(jì)算機(jī)死了,他們都會在下一個(gè)概念體里重生。
閱讀建議:
跟著書本把這里面的結(jié)構(gòu)全部敲一遍,快的話一天就能搞定。
從此你便再不怕懼怕js相關(guān)的簡單數(shù)據(jù)結(jié)構(gòu)問題。
但是,遇上高級的樹,圖等問題該跪還是要跪。因?yàn)檫@本書虎頭蛇尾,后面的高級點(diǎn)的數(shù)據(jù)結(jié)構(gòu)介紹的不夠深。
適合經(jīng)常反思“它從哪里來,要到哪里去?”的js程序員,或后悔以前數(shù)據(jù)結(jié)構(gòu)沒好好學(xué)的前端同學(xué)。
5. JavaScript設(shè)計(jì)模式與開發(fā)實(shí)踐
我認(rèn)為騰訊AlloyTeam的這本書對我?guī)椭敲栏叱倘?/p>
那時(shí)候我恰好換公司,從原來的開發(fā)方式切換成另一種完全不同的開發(fā)方式,讓我很不適應(yīng)。
這本書及時(shí)的蹦出來,他拿實(shí)際的應(yīng)用場景舉例,告訴你不同js項(xiàng)目里如何共通設(shè)計(jì)模式,還極其詳細(xì)的介紹了函數(shù)的高級用法,能讓你對js高階函數(shù)的認(rèn)知上升一個(gè)臺階。
難能可貴的是他還拿java作為靜態(tài)語言的類比。從語言統(tǒng)一高度來給你分析這些問題。
和上本介紹數(shù)據(jù)結(jié)構(gòu)的書一樣,這本書有的放矢,能完美的解決對js設(shè)計(jì)模式有疑問的同學(xué)的實(shí)際問題。
他比上本書更深刻,更易讀,也更貼近實(shí)踐。
閱讀建議:
這是本適合反復(fù)閱讀的書籍。
如果你的思路能根據(jù)應(yīng)用場景自動切換到最適合的設(shè)計(jì)模式,說明你已吃透這本書了。
6. 高性能JavaScript
作為Orelly唯一一本我確實(shí)認(rèn)可的javascript相關(guān)的書。作為Orelly唯一一本我確實(shí)認(rèn)可的javascript相關(guān)的書。
他摒棄了Orelly系列所有我不喜歡的特點(diǎn):
老外的聊天說教式閱讀體驗(yàn),樣例不夠豐富,排版單一,破事水等。
他的優(yōu)點(diǎn)如下:
1. 情景豐富,基本涉及所有js性能優(yōu)化的場景。還會給出不同場景的實(shí)際測試數(shù)據(jù),真實(shí)可信。我們在閱讀這些場景實(shí)例的同時(shí)也豐富了自己js的使用經(jīng)驗(yàn)。
2. 給出了很多看似"旁門左道"的解決方案,而這些冷門的解決方案恰恰是有些人死活百度不到的真正能解決問題的最優(yōu)解。
3. 在說問題的同時(shí)說原理,深入淺出,游刃有余。所以這本書不僅僅是一本介紹js性能相關(guān)的書,而是一本涉及瀏覽器原理,js解析原理,用戶體驗(yàn)等知識的javascript最佳注解。
閱讀建議:
建議和高程三一起看,可以算是高程三閱讀的最佳伴侶。
高程三告訴你“他叫什么,他什么樣”,
這本書就告訴你“他為什么”,“他該怎樣”。
所以,當(dāng)別人還在為某些問題絞盡腦汁的時(shí)候,你已經(jīng)從起點(diǎn)上干翻他們了。
7. 你不知道的JavaScript(YOU DONT KNOW JAVASCRIPT)
大名鼎鼎的Github開源的書籍。大名鼎鼎的Github開源的書籍。
為了他的名氣我也得買一本實(shí)體書來拜讀下。
這本是上卷,只涉及作用域和閉包,this和對象原型兩部分。
不過其深入程度是其他js書籍難以企及的。
可以說,這已經(jīng)是大部分前端程序員對js語法可以深入了解的最底層了,再往下就直面編譯原理了。
縮進(jìn):每一行的層級由4個(gè)空格組成,避免使用Tab進(jìn)行縮進(jìn)。
行的長度:每行長度不應(yīng)超過80個(gè)字符。如果一行超過80個(gè)字符,應(yīng)當(dāng)在一個(gè)運(yùn)算符后換行。下一行應(yīng)當(dāng)增加兩級縮進(jìn)(8個(gè)字符)。
原始值:
字符串應(yīng)當(dāng)始終使用雙引號且保持一行,避免在字符串中使用斜線另起一行。
數(shù)字應(yīng)當(dāng)使用十進(jìn)制整數(shù),科學(xué)計(jì)算法表示整數(shù),十六進(jìn)制整數(shù),或者十進(jìn)制浮點(diǎn)小數(shù),小數(shù)前后應(yīng)當(dāng)至少保留一位數(shù)字。避免使用八進(jìn)制直接量。
特殊值null除了下述情況下應(yīng)當(dāng)避免使用。
用來初始化一個(gè)變量,這個(gè)變量可能被賦值為一個(gè)對象。
用來和一個(gè)已經(jīng)初始化的變量比較,這個(gè)變量可以是也可以不是一個(gè)對象。
當(dāng)函數(shù)的參數(shù)期望是對象時(shí),被用作參數(shù)傳入。
當(dāng)函數(shù)的返回值期望是對象時(shí),被用作返回值傳出。
避免使用特殊值undefined。判斷一個(gè)變量是否定義應(yīng)當(dāng)使用typeof操作符。
運(yùn)算符間距:二元預(yù)算符前后必須使用一個(gè)空格來保持表達(dá)式的整潔。操作符包括賦值運(yùn)算符和邏輯運(yùn)算符。
括號間距:當(dāng)使用括號時(shí),緊接左括號之后和緊接右括號之前不應(yīng)該有空格。
對象直接量:
對象直接量應(yīng)當(dāng)有如下格式。
①起始左花括號應(yīng)當(dāng)同表達(dá)式保持同一行。
②每個(gè)屬性的名值對應(yīng)當(dāng)保持一個(gè)縮進(jìn),第一個(gè)屬性應(yīng)當(dāng)在左花括號后另起一行。
③每個(gè)屬性的名值對應(yīng)當(dāng)使用不含引號的屬性名,其后緊跟一個(gè)冒號(之前不舍空格),其后是值。
④倘若屬性值是函數(shù)類型,函數(shù)體應(yīng)當(dāng)在屬性名之下另起一行,而且其前后均應(yīng)保留一個(gè)空行。
⑤一組相關(guān)的屬性前后可以插入空行以提升代碼的可讀性。
⑥結(jié)束的右花括號應(yīng)當(dāng)獨(dú)占一行。
注釋:使用簡潔明了注釋有助于他人理解你的代碼。如下情況應(yīng)當(dāng)使用注釋。
①代碼晦澀難懂。
②可能被誤認(rèn)為錯誤的代碼。
③必要但不明顯的針對特定瀏覽器的代碼。
④對于對象、方法或者屬性,生成文檔是有必要的(使用恰當(dāng)?shù)奈臋n注釋)。
單行注釋
①單行注釋應(yīng)當(dāng)用來說明一行代碼或者一組相關(guān)的代碼。單行注釋可能有三種使用方式。
②獨(dú)占一行的注釋,用來解釋下一行代碼。
③在代碼行的尾部的注釋,用來解釋它之前的代碼。
④多行,用來注釋掉一個(gè)代碼塊。
多行注釋
多行注釋應(yīng)當(dāng)在代碼需要更多文字去解釋的時(shí)候使用。每個(gè)多行注釋都至少有如下三行:
①首行僅僅包括/*注釋開始。該行不應(yīng)當(dāng)有其他文字。
②接下來的行以*開頭并保持左對齊。這些可以有文字描述。
③最后一行以*/開頭并同先前行保持對齊。也不應(yīng)有其他文字。
多行注釋的首行應(yīng)當(dāng)保持同它描述代碼的相同層次的縮進(jìn)。后續(xù)的每行應(yīng)當(dāng)有同樣層次的縮進(jìn)并附加一個(gè)空格(為了適當(dāng)保持*字符的對齊)。每一個(gè)多行代碼之前應(yīng)當(dāng)預(yù)留一個(gè)空行。
命名:變量和函數(shù)在命名時(shí)應(yīng)當(dāng)小心。命名應(yīng)緊限于數(shù)字字母字符,某些情況下可以使用下劃線(_)。最好不要在任何命名中使用美元符號($)或者反斜杠(\)。
變量命名應(yīng)當(dāng)采用駝峰命名格式,首字母小寫,每個(gè)單詞首字母大寫。變量名的第一個(gè)單詞應(yīng)當(dāng)是一個(gè)名詞(而非動詞)以避免同函數(shù)混淆。不要在變量名中使用下劃線。
函數(shù)名也應(yīng)當(dāng)采用駝峰命名格式。函數(shù)名的第一個(gè)單詞應(yīng)當(dāng)是動詞(而非名詞)來避免同變量混淆。函數(shù)名中最好不要使用下劃線。
構(gòu)造函數(shù)--通過new運(yùn)算符創(chuàng)建新對象的函數(shù)--也應(yīng)當(dāng)以駝峰格式命名并且首字符大寫。構(gòu)造函數(shù)名稱應(yīng)當(dāng)以非動詞開頭,因?yàn)閚ew代表著創(chuàng)建一個(gè)對象實(shí)例的操作。
常量(值不會被改變的變量)的命名應(yīng)當(dāng)是所有大寫字母,不同單詞之間單個(gè)下劃線隔開。
對象的屬性同變量的命名規(guī)則相同。對象的方法同函數(shù)的命名規(guī)則相同。如果屬性或者方法是私有的,應(yīng)當(dāng)在之前加上一個(gè)下劃線。
9. 變量與函數(shù)聲明:
變量聲明
所有的變量在使用前都應(yīng)當(dāng)事先定義。變量定義應(yīng)當(dāng)放在函數(shù)開頭,使用一個(gè)var表達(dá)式每行一個(gè)變量。除了首行,所有行都應(yīng)當(dāng)多一層縮進(jìn)以使變量名能夠垂直方向?qū)R。變量定義時(shí)應(yīng)當(dāng)初始化,并且賦值操作符應(yīng)當(dāng)保持一致的縮進(jìn)。初始化的變量應(yīng)當(dāng)在未初始化變量之前。
函數(shù)聲明
函數(shù)應(yīng)當(dāng)在使用前提前定義。一個(gè)不是作為方法的函數(shù)(也就是說沒有作為一個(gè)對象的屬性)應(yīng)當(dāng)使用函數(shù)定義的格式(不是函數(shù)表達(dá)式和Function構(gòu)造器格式)。函數(shù)名和開始圓括號之間不應(yīng)當(dāng)有空格。結(jié)束的圓括號和右邊的花括號之間應(yīng)當(dāng)留一個(gè)空格。右側(cè)的花括號應(yīng)當(dāng)同function關(guān)鍵字保持同一行。開始和結(jié)束括號之間不應(yīng)該有空格。參數(shù)名之間應(yīng)當(dāng)在逗號之后保留一個(gè)空格。函數(shù)體應(yīng)當(dāng)保持一級縮進(jìn)。
匿名函數(shù)
可能作為方法賦值給對象,或者作為其他函數(shù)的參數(shù)。function關(guān)鍵字同開始括號之間不應(yīng)有空格。
立即被調(diào)用的函數(shù)應(yīng)當(dāng)在函數(shù)調(diào)用的外層用園括號包裹。
嚴(yán)格模式應(yīng)當(dāng)僅限在函數(shù)內(nèi)部使用,千萬不要在全局使用。
10. 運(yùn)算符:
賦值
給變量賦值時(shí),如果右側(cè)是含有比較語句的表達(dá)式,需要用圓括號包裹。
等號運(yùn)算符
使用===(嚴(yán)格相等)和!==(嚴(yán)格不相等)代替==(相等)和!=(不等)來避免弱類型轉(zhuǎn)換錯誤。
三元操作符
三元運(yùn)算符應(yīng)當(dāng)僅僅用在條件賦值語句中,而不要作為if語句的替代品。
11. ?語句:
簡單語句
每一行最多只包含一條語句。所有簡單的語句都應(yīng)該以分號(;)結(jié)束。
返回語句
返回語句當(dāng)返回一個(gè)值的時(shí)候不應(yīng)當(dāng)使用圓括號包裹,除非在某些情況下這么做可以讓返回值更容易理解。
復(fù)合語句
復(fù)合語句是大括號括起來的語句列表。
括起來的語句應(yīng)當(dāng)較復(fù)合語句多縮進(jìn)一個(gè)層級。
開始的大括號應(yīng)當(dāng)在復(fù)合語句所在行的末尾;結(jié)束的大括號應(yīng)當(dāng)獨(dú)占一行且同復(fù)合語句的開始保持同樣的縮進(jìn)。
當(dāng)語句是控制結(jié)構(gòu)的一部分時(shí),諸如if或者for語句,所有語句都需要用大括號括起來,也包括單個(gè)語句。這個(gè)約定使得我們更方便地添加語句而不用擔(dān)心忘記加括號而引起bug。
像if一樣的語句開始的關(guān)鍵詞,其后應(yīng)該緊跟一個(gè)空格,起始大括號應(yīng)當(dāng)在空格之后。
12. 留白:
在邏輯相關(guān)的代碼之間添加空行代碼可以提高代碼的可讀性。
兩行空行僅限于在如下情況下使用:
在不同的源代碼文件之間。
在類和接口定義之間。
單行空行僅限在如下情況中使用。
方法之間。
方法中局部變量和第一行語句之間。
多行或者單行注釋之前。
方法中邏輯代碼塊之間以提升代碼的可讀性。
空格應(yīng)當(dāng)在如下的情況下使用。
關(guān)鍵詞后跟括號的情況應(yīng)當(dāng)用空格隔開。
參數(shù)列表中逗號之后應(yīng)當(dāng)保留一個(gè)空格。
所有的除了點(diǎn)(.)之外的二元運(yùn)算符,其操作數(shù)都應(yīng)當(dāng)用空格隔開。單目運(yùn)算符的操作數(shù)之間不應(yīng)該用空白隔開,例如一元減號,遞增(++),遞減(--)。
for 語句的表達(dá)式之間應(yīng)當(dāng)用空格隔開。
13. 需要避免的
切勿使用像String一類的原始包裝類型創(chuàng)建新的對象。
避免使用eval()。
避免使用with語句。該語句在嚴(yán)格模式中不復(fù)存在,可能在未來的ECMAScript標(biāo)準(zhǔn)中也將去除。
沒有絕對的準(zhǔn)則,只有適不適合。
你好 如果是IDE的話,HBuilder和webstorm都不錯,對于javascript和框架的提示都不錯,不過webstorm是收費(fèi)的,HBuilder是免費(fèi)的,如果是編輯器的話?Sublime Text 3 不錯,但是如果需要javascript提示的話需要裝插件,如果需要其他框架提示的話也需要裝插件。
HBuilder
webstorm
Sublime Text 3
希望我的回答能夠幫助到你,如果還有什么疑問可以繼續(xù)追問。