JavaScript高階程式設計學習(一)之介紹

youcongtech發表於2018-05-17
JavaScript程式設計

作為一名web開發人員，日常用的最多的就是js,也就是大名鼎鼎的ECMAScript,又稱javascript。再次宣告js與java除了語法上相似，沒有半毛錢關係。據說之所以叫javascript,是因為過去網景公司花了十天時間開發歷史上的第一版js,但當時沒有名氣，故借用java之名在該script字首上加上一個java，以提升其知名度。具體的歷史或老皇曆，百度或者相關官網一大堆，這裡不再贅述。

作為一名前後臺都攻的軟體工程師，雖說平時js足以解決常見的問題和共性問題，但發現總會有這樣那樣的小錯誤，有的時候，就是那麼一個小錯誤，除錯了3~4小時，浪費了很多時間，最後解決了，卻發覺分分鐘可以解決的問題，我居然花了這麼長時間，覺得太對不起有限的光陰。所以決定好好系統學習下javascript。在我看來，為該書做序的人，說的一句話，挺對的，js上手是非常容易的，要麼跟著w3scholl一遍遍敲，記得當初我學習js的時候就是這樣，又或者參考廖雪峰的js教程，他們的教程很容易讓你熟悉並瞭解js。

下面是網站:

w3school:  http://www.w3school.com.cn/js/index.asp

廖雪峰教程:https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000

不過如果是小白建議還是從w3school入手吧，當然在此也可以看看廖雪峰。我個人是從w3school一遍遍敲，一遍遍執行，一遍遍找部落格瞭解和熟悉。但是部落格畢竟是零散的，不夠系統。視訊了，我個人學習視訊一大堆，有好哥們分享的，也有朋友給的。說到視訊，如果你是完全的小白，建議可以先看視訊再實戰，因為視訊可以讓你瞭解熟悉，等到有了基本的熟悉，去除了一些陌生感，就是實戰吧！

或許有人問，我為什麼不看視訊學習呢?

第一，我個人有相關經驗，可以看懂js和使用js解決專案問題;

第二,作為一名工程師，平時忙於工作，沒有很多時間去看視訊，視訊的時間太長了;

第三，在我看來視訊適合小白，完全不懂的，但是作為有相關實戰經驗的人，沒多大必要，當然有些進階相關的視訊還是不錯的;

第四，書相對於視訊，系統全面，而且，上下班地鐵差不多的兩個小時，我可以通過手機閱讀，至少可以讀完一章,這樣時間也就充分的利用了;

 

說到js，至今我仍覺得它是一個非常神祕又好用的玩意，它可以做出酷炫的效果，也可以讓我前後端分離開發,同時作為一名Java程式設計師，它的語法對我而言太容易懂了。當然，還是那句話，入手容易，深入難。如今我要打破這個瓶頸。

下面進行系統的講解:

1.JavaScript由三部分組成

(1)核心(ECMASCRIPT)，又稱ECMA262，是js的核心;

ECMA由以下部分組成:

a.語法

b.型別

c.關鍵字

d.語句

e.保留字

f.操作符

g.物件

 

 

(2)瀏覽器物件模型;

常用的window,location，screen等，

我用的比較多的，還是window和location

window常用的方法

alert（）警示框  常用於提示資訊

confirm()確認框    通常用於是否刪除這樣的或是否啟用等

propt()輸入框  這個用的不多

setInterval()每隔多長時間載入 ，可以呼叫多次， ajax輪詢可以使用它，不過太消耗伺服器資源，應用的通常是資料定時更新

setTimeout()每隔多長時間載入 ，一般只載入一次

location.href用的比較多  前後端分離時，不過通過form提交的形式，直接通過window.location.href進入另外一個介面

location.reload用的也比較多 

當然瀏覽器物件除了上述說的，還有navicator，不過這個我也沒用過，開發一段時間，從未用過，看字面意思，似乎有導航的作用 

 

(3)文件物件模型;

文件物件，簡單的說對節點進行增，刪，改，查。

增加的話，比如遍歷資料後，將html元素，通過append方法追加到某個ID選擇器或者類選擇器中

刪除的話，節點刪除，比如，上級公司下級部門這樣的

修改的話，replace方法替換

查的話，find或push之類的方法

 

這是我個人開發用的比較多的

 

2.html頁面如何寫js

html寫js有三種方式：

(1)外部js 通過<script src=”test.js”></script>引入html中，從而可呼叫該js檔案中所有函式,我個人建議，非常強烈建議開發，不論是初學者還是半路出家的，多寫外部js少寫內部js或者直接在<body></body>中嵌入js,因為這種寫法一點都不好，至少我這麼認為,寫外部js可以將公共部分js抽取複用，而且方便管理修改規範;

執行示例:

test.html

<html>
<head>
<script src="test.js"></script>
</head>
<body>
</body>
</html>

 

test.js

alert("hello js")

 

 

(2)內部js 在<head></head>中嵌入<script></script>

<html>
<head>
<script>
alert("hello js")
</script>
</head>
<body>
</body>
</html>

(3)<body></body>內嵌入js

<html>
<head>
</head>
<body>

<script>
alert("hello js")
</script>
</body>
</html>

 

（1）還是那句話，建議使用，(2)的話，慎用，因為到時對web進行優化時，<head></head>內嵌入大量的js將會導致瀏覽器載入網頁速度變慢,不利於web效能優化

另外js檔案放頭部和尾部的效果是不一樣的，因為頭部優先載入，頭部通常放置css外部檔案，尾部放置js，因為瀏覽器優先載入頭部，由頭到尾，由於css優先載入，這樣渲染效果也會很快，如果是js檔案放置頭部的話，會導致css渲染效果變慢從而導致影響使用者體驗

 


相關文章