JavaScript（一）：JavaScript簡介

時間 2019-11-21

原文原文鏈接

1、什麼是JavaScriptjavascript

JavaScript是一種具備面向對象能力的、解釋性的程序設計語言。更具體一點，它是基於對象和事件驅動並具備相對安全性的客戶端腳本語言。由於他不須要在一個語言環境下運行，而只須要支持它的瀏覽器便可。它的主要目的是：驗證發往服務器端的數據的合法性、增長web互動、增強用戶體驗度等。html

基於對象：JavaScript中內置了不少對象，直接調用對象的屬性和方法進行操做，簡化編程。
事件驅動：程序開始運行到結束，能夠一直偵聽事件。
解釋性語言：不須要編譯成計算機專門去讀的文件，調用哪塊解釋哪塊，並不是一次性編譯。例如：c#就是編譯性語言，若是要運行C#語言編寫的程序，就必須先編譯成exe或者dll文件才能運行。而JavaScript不須要預先編譯
腳本語言：須要嵌入到別的語言之中，JS須要嵌入在HTML中，單獨存在沒有意義。

2、JavaScript和ECMAScript的關係java

ECMAScript是JavaScript的標準和基礎

3、JavaScript特色
一、鬆散性（弱類型）
JavaScript語言核心與C、C++、Java類似，好比條件判斷、循環、運算符等。可是，它倒是一種鬆散類型的語言，也就是說，它的變量沒必要具備一個明確的類型。（變量無需聲明也可使用，一個變量賦值爲數字類型，還能夠在賦值爲字符串等其它類型）
二、對象屬性
JavaScript中的對象把屬性名映射爲任意的屬性值。它的這種方式很像哈希表或關聯數組，而不像C中的結構體或者C++、Java中的對象。
三、繼承機制
JavaScript中的面向對象繼承機制是基於原型的（原型：最基礎的基類），和C++以及Java中的繼承大不相同（能夠子類繼承父類）。web

四、嚴格區分大小寫。編程

4、JavaScript組成部分
一個完整的JavaScript應該由下列三個不一樣的部分組成：c#

一、核心（ECMAScript）
主要定義了JavaScript的語言基礎部分，各個瀏覽器都嚴格遵照該規範，沒有兼容性問題，ECMAScript規範由ECMA制訂。組成部分：語法、類型、語句、關鍵字、保留字、操做符、對象等。
二、文檔對象模型（DOM）
文檔對象模型（Document object Model）主要定義瞭如何將HTML轉換成一顆符合DOM規範的樹，而且如何對這棵樹進行相應的操做。該規範由W3c定義，可是，部分瀏覽器沒有嚴格遵照該規範，寫代碼時須要考慮兼容性問題。

HTML和XML的應用程序接口（API）。
把整個頁面規劃爲層級式的節點結構。

三、瀏覽器對象模型（BOM）
瀏覽器對象模型（Browser Object Model）內置了一些對象，用來操做窗口，這些對象包括window、screen、location、navigator、document、xmlhttprequet,雖然該部分沒有規範，可是，各個瀏覽器都支持這些對象。開發人員使用BOM能夠控制瀏覽器顯示頁面之外的部分。而BOM真正不同凡響的地方（也是常常會致使問題的地方），仍是它做爲JavaScript實現的一部分，至今仍沒有相關的標準。

可對瀏覽器窗口進行訪問和操做，包括：

彈出新的瀏覽器窗口。數組

移動、關閉瀏覽器窗口及調節瀏覽器窗口大小。瀏覽器

獲取用戶屏幕分辨率的屏幕對象。緩存

web瀏覽器詳細的定位對象。安全

5、使用JavaScript

一、<Script>標籤解析
<script>xxx</script>這組標籤，是用於在HTML頁面中插入JS的主要方法。它主要有如下幾個屬性：
一、charset：可選。表示經過src屬性指定的字符集。因爲大多數瀏覽器忽略它，因此不多有人用它。
二、defer：可選。表示腳本能夠延遲到文檔徹底被解析和顯示以後再執行。因爲大多數瀏覽器不支持，故不多用。
三、language：已廢棄。原來用於代碼使用的腳本語言。因爲大多數瀏覽器忽略它，因此不要用了。
四、src：可選。表示包含要執行代碼的外部文件。
五、type：必需。能夠看做是language的替代品。表示代碼使用的腳本語言的內容類型。範例：type="text/javascript"

<scripe>標籤示例：

6、JavaScript使用方式：
一、事件定義式：在定義事件時直接寫入JavaScript腳本。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>事件定義式</title>
</head>
<body>
    <input type="button" value="點擊" onclick="alert('我被點擊了')" />
</body>
</html>

效果：

二、直接嵌入式：在網頁中直接嵌入JavaScript。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>直接嵌入式</title>
    <script>
       function btnClick(){
           alert("我是寫在head裏面的JavaScript");
       };
    </script>
</head>
<body>
    <input type="button" value="點擊" onclick="btnClick()" />
    <script>
       alert("我是寫在body裏面的JavaScript");
    </script>
</body>
</html>

效果：

注意：

使用直接嵌入式的時候，JavaScript腳本能夠寫在<head>標籤裏面，也能夠寫在<body>標籤裏面。

三、文件調用式：在網頁中調用獨立的JavaScript文件。把js代碼寫在單獨的一個js文件中，經過src屬性引入便可。它具備維護性高、可緩存（加載一次，無需再次加載）、方便將來擴展的特色。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>文件調用式</title>
    <script src="../demo.js"></script>
</head>
<body>
    <input type="button" value="點擊" onclick="btnClick()" />
</body>
</html>

注意：一、使用外部樣式引入js，雖然沒有任何代碼了，但也不能使用單標籤：<script type="text/javascript" src="demo.js"/>二、不能再裏面添加任何代碼，添加的代碼執行不到<script type="text/javascript" src="demo.js">alert('我很可憐，由於執行不到')</script>

相關標籤/搜索

javascript...function

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。