不需要一直堅(jiān)持寫原生代碼，可以根據(jù)實(shí)際需要選擇，需要用框架就學(xué)框架，遇到問(wèn)題再去了解對(duì)應(yīng)的知識(shí)點(diǎn)。
創(chuàng)新互聯(lián)建站是一家專注于成都網(wǎng)站建設(shè)、做網(wǎng)站與策劃設(shè)計(jì),大新網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)建站做網(wǎng)站,專注于網(wǎng)站建設(shè)十載,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:大新等地區(qū)。大新做網(wǎng)站價(jià)格咨詢:18982081108
如果有足夠的時(shí)間，還是要把JavaScript基礎(chǔ)學(xué)好。遇到難點(diǎn)是很正常的事情，不理解的可以選擇先跳過(guò)，過(guò)一段時(shí)間再來(lái)看，不要被嚇到?？吹絼e人寫的代碼看不懂也可以先模仿，有時(shí)間就學(xué)習(xí)相關(guān)知識(shí)點(diǎn)，真正理解為什么這么做。
1學(xué)習(xí)javascript之前盡量先學(xué)習(xí)html與CSS。之后再學(xué)習(xí)javascript多看看源代碼，多寫，多練，直到寫出功能為止
2查看知名網(wǎng)站的源代碼，打開網(wǎng)頁(yè)，點(diǎn)擊右鍵查看源代碼，或者保存整個(gè)網(wǎng)頁(yè)。
3盡量的去理解當(dāng)前流行的javascript框架源代碼，百度 谷歌都是很好的老師，不懂就問(wèn)。
4不要去培訓(xùn)班，老師教的東西，都不是很深層次的，更何況培訓(xùn)機(jī)構(gòu)是以盈利為目的。買幾本好處，三個(gè)月就能學(xué)會(huì)的東西，培訓(xùn)機(jī)構(gòu)非得整個(gè)一年半載的。
今天小編要跟大家分享的文章是關(guān)于Web前端新手應(yīng)該知道的JavaScript開發(fā)技巧有哪些?熟悉Web前端的小伙伴都知道，Javascript
的很多擴(kuò)展的特性是的它變得更加的犀利，同時(shí)也給予程序員機(jī)會(huì)創(chuàng)建更漂亮并且更讓用戶喜歡的網(wǎng)站。
盡管很多的開發(fā)人員都樂(lè)于頌揚(yáng)javascript，但是仍舊有人看到它的陰暗面。
使用很多javascript代碼的Web頁(yè)面會(huì)加載很慢，過(guò)多的使用javascript使得網(wǎng)頁(yè)丑陋和拖沓。很快如何有效地使用
javascript成為一個(gè)非?；馃岬脑掝}。
今天小編就為Web前端新手準(zhǔn)備了這篇JavaScript開發(fā)技巧，希望能夠?qū)δ阌兴鶐椭?，下面我們一起?lái)看一看吧!
1、盡可能的保持代碼簡(jiǎn)潔
可能大家都聽到過(guò)了N遍這個(gè)代碼簡(jiǎn)潔問(wèn)題了。作為一個(gè)開發(fā)人員你可能在你的代碼開發(fā)過(guò)程中使用了很多次，但千萬(wàn)不要在js開發(fā)中忘記這點(diǎn)。
§盡量在開發(fā)模式中添加注釋和空格，這樣保持代碼的可讀性
§在發(fā)布到產(chǎn)品環(huán)境前請(qǐng)將空格和注釋都刪除，并且盡量縮寫變量和方法名
§使用第三方工具幫助你實(shí)現(xiàn)壓縮javascript。
2、思考后再修改prototypes
添加新的屬性到對(duì)象prototype中是導(dǎo)致腳本出錯(cuò)的常見(jiàn)原因。
yourObject.prototype.anotherFunction='Hello';
yourObject.prototype.anotherMethod=function(){...}
在上面代碼中，所有的變量都會(huì)被影響，因?yàn)樗麄兌祭^承于yourObject。這樣的使用會(huì)導(dǎo)致意想不到的行為。所以建議在使用完后刪除類似的修改。
yourObject.prototype.anotherFunction='Hello';
yourObject.prototype.anotherMethod=function(){};
test.anotherMethod();
deleteyourObject.prototype.anotherFunction='Hello';
deleteyourObject.prototype.anotherMethod=function(){};
3、DebugJavascript代碼
即使最好的開發(fā)人員都會(huì)犯錯(cuò)。為了最大化的減少類似錯(cuò)誤，請(qǐng)?jiān)谀愕膁ebugger中運(yùn)行你的代碼，確認(rèn)你沒(méi)有遇到任何細(xì)微的錯(cuò)誤。
4、避免Eval
你的JS在沒(méi)有eval方法的時(shí)候也可以很好的工作。eval允許訪問(wèn)javascript編譯器。如果一個(gè)字符串作為參數(shù)傳遞到
eval，那么它的結(jié)果可以被執(zhí)行。
這會(huì)很大的降低代碼的性能。盡量避免在產(chǎn)品環(huán)境中使用eval。
5、最小化DOM訪問(wèn)
DOM是最復(fù)雜的API，會(huì)使得代碼執(zhí)行過(guò)程變慢。有時(shí)候Web頁(yè)面可能沒(méi)有加載或者加載不完整。最好避免DOM。
6、在使用javascript類庫(kù)之前先學(xué)習(xí)javascript
互聯(lián)網(wǎng)充斥著很多的javascript類庫(kù)，很多程序員都往往使用js類庫(kù)而不理解負(fù)面影響。強(qiáng)烈建議你在使用第三方類庫(kù)之前學(xué)習(xí)基本的JS
代碼，否則，你就準(zhǔn)備著倒霉吧。
7、不要用“SetTimeOut”和“Setinterval”方法來(lái)作為“Eval”的備選
setTimeOut("document.getID('value')",3000);
在以上代碼中document.getID(‘value’)在setTimeOut方法中被作為字符串來(lái)處理。這類似于eval
方法，在每個(gè)代碼執(zhí)行中來(lái)執(zhí)行一個(gè)字符串，因此會(huì)降低性能，因此，建議在這些方法中傳遞一個(gè)方法。
setTimeOut(yourFunction,3000);
8、[]比newArray();更好
一個(gè)常犯的錯(cuò)誤在于使用當(dāng)需要數(shù)組的時(shí)候使用一個(gè)對(duì)象或者該使用對(duì)象的時(shí)候使用一個(gè)數(shù)組。但是使用原則很簡(jiǎn)單：
“當(dāng)屬性名稱是小的連續(xù)整數(shù)，你應(yīng)該使用數(shù)組。否則，使用一個(gè)對(duì)象”_DouglasCrockford,JavaScript:Good
Parts的作者.
建議：
vara=['1A','2B'];
避免：
vara=newArray();
a[0]="1A";
a[1]="2B";
9、盡量不要多次使用var
在初始每一個(gè)變量的時(shí)候，程序員都習(xí)慣使用var關(guān)鍵字。相反，建議你使用逗號(hào)來(lái)避免多余的關(guān)鍵字，并且減少代碼體積。如下：
varvariableOne='string1',
variableTwo='string2',
variableThree='string3';
10、不要忽略分號(hào)“;”
這往往是大家花費(fèi)數(shù)個(gè)小時(shí)進(jìn)行debug的原因之一。
我很確信你肯定也在其它的文章中閱讀過(guò)以上相關(guān)的內(nèi)容，但是大家可能往往都忽略了很多基本的規(guī)則。你是不是也曾經(jīng)忽略過(guò)分號(hào)。是不是也遇到過(guò)eval
關(guān)鍵字問(wèn)題導(dǎo)致性能問(wèn)題?
以上就是小編今天為大家分享的關(guān)于Web前端新手應(yīng)該知道的JavaScript
開發(fā)技巧有哪些?的文章，希望本篇文章能夠?qū)倓偨佑|Web前端行業(yè)的新手們有所幫助。想要了解更多Web前端知識(shí)記得關(guān)注北大青鳥Web前端培訓(xùn)官網(wǎng)!
*聲明：內(nèi)容與圖片均來(lái)源于網(wǎng)絡(luò)(部分內(nèi)容有修改)，版權(quán)歸原作者所有，如來(lái)源信息有誤或侵犯權(quán)益，請(qǐng)聯(lián)系我們刪除或授權(quán)事宜。
你好！！
你可以這樣理解這段代碼：
function?person(firstname,lastname,age,eyecolor)//person的構(gòu)造函數(shù)
{
this.firstname=firstname;????//屬性firstname
this.lastname=lastname;?????//屬性lastname
this.age=age;???????????????????????//屬性age
this.eyecolor=eyecolor;???????//屬性eyecolor
//this.changeName可以理解為person的一個(gè)屬性
//但是這個(gè)屬性指向的是一個(gè)方法即下面的function?changeName(name){...}這個(gè)函數(shù)
//因此，也可以將它理解為person的一個(gè)方法，通過(guò)這個(gè)方法可以為lastname屬性賦值
this.changeName=changeName;????
function?changeName(name)
{
this.lastname=name;?
}
//上面的這一段，也可以寫成下面的樣子
//this.changeName?=?function(name){
//????this.lastname?=?name;
//}
}
javascript中函數(shù)也是對(duì)象，因此可以通過(guò)對(duì) 對(duì)象 的屬性、方法的設(shè)置，來(lái)達(dá)到我們自己的想要的結(jié)果。
上面的person，完全可以理解為一個(gè)person類，它有4個(gè)屬性和一個(gè)方法，然后通過(guò)new關(guān)鍵字，我們得到了一個(gè)person類型的對(duì)象，再通過(guò)“對(duì)象.方法名(參數(shù))” 來(lái)進(jìn)行方法的調(diào)用！！
希望對(duì)你有幫助！！
可以看，但是你會(huì)發(fā)現(xiàn)有很多東西是看不太懂的。比如閉包、原型鏈、作用域鏈、js的面向?qū)ο蟮葍?nèi)容。
我給你的建議是先看一些入門類型的js教程，先跟著書一起熟悉基礎(chǔ)概念，比如js的數(shù)據(jù)類型啊，DOM以及BOM還有events等等概念，可以跟著書一起做做小例子，增強(qiáng)一些你學(xué)習(xí)的信心。
推薦你看看《javascript從入門到精通》，這一類的入門書籍比較適合新手。
開發(fā)環(huán)境越簡(jiǎn)單越好，一定不要在這個(gè)環(huán)節(jié)浪費(fèi)時(shí)間。
首先說(shuō)編輯器的選擇，sublime text、vs code、atom、webstorm，還有HBuilder。新手入門的時(shí)候總想找一個(gè)最好的編輯器，其實(shí)這編輯器就和游戲里面選英雄一樣，沒(méi)有最厲害的，只有最適合你的，如果還是拿不定注意，就選vs code吧，我感覺(jué)這個(gè)對(duì)新手挺友好的。
瀏覽器就用chrome，然后就可以開始擼代碼了。
關(guān)于JavaScript版本，我建議還是從ES5開始學(xué)，有一定基礎(chǔ)之后再來(lái)看ES2015+的新特性。
基本語(yǔ)法
學(xué)編程語(yǔ)言和學(xué)自然語(yǔ)言有很多相似的地方，我們得從最基本的單詞和語(yǔ)法開始學(xué)。
變量：如何聲明變量，如何給變量賦值。
數(shù)據(jù)類型：什么是數(shù)據(jù)類型，數(shù)字與字符串有什么區(qū)別。
運(yùn)算符與表達(dá)式：常用的運(yùn)算符有哪些？“=”、“==”與“===”的區(qū)別等等。
分支語(yǔ)句：if、switch
循環(huán)語(yǔ)句：for、while
函數(shù)：什么是函數(shù)，什么是參數(shù)，什么是返回值。
這些基本語(yǔ)法一定要非常熟悉，要不然后續(xù)的學(xué)習(xí)會(huì)舉步維艱。
對(duì)象
對(duì)象是一個(gè)非常重要的概念，一定要靈活掌握：
對(duì)象：屬性的無(wú)序集合，當(dāng)屬性值為函數(shù)的時(shí)候，我們叫這個(gè)函數(shù)為對(duì)象的方法。
數(shù)組：元素的有序集合。了解數(shù)組的常用方法
日期對(duì)象：獲取年月日時(shí)分秒
數(shù)學(xué)對(duì)象：獲取隨機(jī)數(shù)
了解其他對(duì)象：正則表達(dá)式、包裝對(duì)象，其實(shí)函數(shù)也是對(duì)象，不過(guò)這些簡(jiǎn)單了解一下就行。
每個(gè)對(duì)象都有很多方法，這些方法知道在哪里查就行了，千萬(wàn)不要去背，就像我們學(xué)英語(yǔ)，必要的單詞要背，但是大部分單詞知道用詞典查就行了。
DOM
DOM的樹狀結(jié)構(gòu)
節(jié)點(diǎn)：元素節(jié)點(diǎn)、文本節(jié)點(diǎn)、屬性節(jié)點(diǎn)
節(jié)點(diǎn)關(guān)系：同級(jí)、父子級(jí)等等
獲取節(jié)點(diǎn)：querySelector、querySelectorAll等等
節(jié)點(diǎn)操作：增刪改查
事件綁定：事件流和事件委托應(yīng)該了解一下
DOM提供的方法也很多，仍然不要過(guò)多的投入精力，新手自學(xué)總是會(huì)被這些大量的方法困擾，我們要做的是對(duì)DOM有一個(gè)概括性的了解，至于那些雜亂的接口，后續(xù)我們完全可以用jQuery或框架代替。
（如果對(duì)DOM感興趣，可以在技能掌握得稍微全面一些之后，再回來(lái)深入學(xué)習(xí)也是可以的，但是前期投入大量時(shí)間，確實(shí)會(huì)影響學(xué)習(xí)效率）
jQuery
jQuery是必須要會(huì)的，但是jQuery上手確實(shí)很簡(jiǎn)單，用兩天時(shí)間了解一下jQuery的用法，然后就可以利用jQuery實(shí)現(xiàn)各種頁(yè)面效果了，前期肯定會(huì)磕磕絆絆，但是jQuery的資料有很多，一邊學(xué)一邊做就行。jQuery熟練了之后，就可以開始著手學(xué)習(xí)JavaScript進(jìn)階一點(diǎn)的內(nèi)容了：
原始類型與引用類型的區(qū)別
各種類型轉(zhuǎn)換和類型檢測(cè)
閉包：函數(shù)套函數(shù)，怎么套自己都不蒙就行了。
原型：構(gòu)造函數(shù)、原型屬性、基于原型的繼承是怎么實(shí)現(xiàn)的。
this：可以開個(gè)坑好好研究研究
了解node
node現(xiàn)在可以說(shuō)是前端必學(xué)的了，但是不是學(xué)用node做后臺(tái)，而是用node生態(tài)下的各種工具，順便借node了解一下后臺(tái)。
使用node開一個(gè)靜態(tài)服務(wù)器
使用npm下載第三方模塊
webpack
babel
最好能用express寫一個(gè)簡(jiǎn)單的后臺(tái)程序（一個(gè)server.js就夠了），處理一些請(qǐng)求，這樣我們學(xué)習(xí)ajax的時(shí)候就可以自己寫后臺(tái)接口了，當(dāng)然這需要有http協(xié)議的基礎(chǔ)知識(shí)。
ES2+新特性
變量和常量：為什么要拋棄var？
結(jié)構(gòu)賦值
箭頭函數(shù)
模塊化
class
編譯
像promise，async/await函數(shù)等等這些，看自己能力了，有興趣看看，不看也不影響后面學(xué)習(xí)，但是，就算現(xiàn)在不學(xué)，這個(gè)后續(xù)也是要補(bǔ)的。
框架
react、vue選一，零基礎(chǔ)的初學(xué)者強(qiáng)烈推薦vue，如果技術(shù)型前端，推薦react。
重慶分公司
重慶分公司
