JavaScript基礎(chǔ)介紹與實例
更新時間：2022年02月26日 09:07:31 作者：.NET開發(fā)菜鳥
這篇文章介紹了JavaScript的基礎(chǔ)與實例，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
一、什么是JavaScript
JavaScript是一種具有面向?qū)ο竽芰Φ?、解釋性的程序設(shè)計語言。更具體一點(diǎn)，它是基于對象和事件驅(qū)動并具有相對安全性的客戶端腳本語言。因為他不需要在一個語言環(huán)境下運(yùn)行，而只需要支持它的瀏覽器即可。它的主要目的是：驗證發(fā)往服務(wù)器端的數(shù)據(jù)的合法性、增加web互動、加強(qiáng)用戶體驗度等。
- 基于對象：JavaScript中內(nèi)置了很多對象，直接調(diào)用對象的屬性和方法進(jìn)行操作，簡化編程。
- 事件驅(qū)動：程序開始運(yùn)行到結(jié)束，可以一直偵聽事件。
- 解釋性語言：不需要編譯成計算機(jī)專門去讀的文件，調(diào)用哪塊解釋哪塊，并非一次性編譯。例如：c#就是編譯性語言，如果要運(yùn)行C#語言編寫的程序，就必須先編譯成exe或者dll文件才能運(yùn)行。而JavaScript不需要預(yù)先編譯
- 腳本語言：需要嵌入到別的語言之中，JS需要嵌入在HTML中，單獨(dú)存在沒有意義。
二、JavaScript和ECMAScript的關(guān)系
- ECMAScript是JavaScript的標(biāo)準(zhǔn)和基礎(chǔ)
三、JavaScript特點(diǎn)
1、松散性（弱類型）
JavaScript語言核心與C、C++、Java相似，比如條件判斷、循環(huán)、運(yùn)算符等。但是，它卻是一種松散類型的語言，也就是說，它的變量不必具有一個明確的類型。（變量無需聲明也可以使用，一個變量賦值為數(shù)字類型，還可以在賦值為字符串等其它類型）
2、對象屬性
JavaScript中的對象把屬性名映射為任意的屬性值。它的這種方式很像哈希表或關(guān)聯(lián)數(shù)組，而不像C中的結(jié)構(gòu)體或者C++、Java中的對象。
3、繼承機(jī)制
JavaScript中的面向?qū)ο罄^承機(jī)制是基于原型的（原型：最基礎(chǔ)的基類），和C++以及Java中的繼承大不相同（可以子類繼承父類）。
4、嚴(yán)格區(qū)分大小寫。
四、JavaScript組成部分
一個完整的JavaScript應(yīng)該由下列三個不同的部分組成：
1、核心（ECMAScript）
- 主要定義了JavaScript的語言基礎(chǔ)部分，各個瀏覽器都嚴(yán)格遵守該規(guī)范，沒有兼容性問題，ECMAScript規(guī)范由ECMA制訂。組成部分：語法、類型、語句、關(guān)鍵字、保留字、操作符、對象等。
2、文檔對象模型（DOM）
- 文檔對象模型（Document object Model）主要定義了如何將HTML轉(zhuǎn)換成一顆符合DOM規(guī)范的樹，并且如何對這棵樹進(jìn)行相應(yīng)的操作。該規(guī)范由W3c定義，但是，部分瀏覽器沒有嚴(yán)格遵守該規(guī)范，寫代碼時需要考慮兼容性問題。
- HTML和XML的應(yīng)用程序接口（API）。
- 把整個頁面規(guī)劃為層級式的節(jié)點(diǎn)結(jié)構(gòu)。
3、瀏覽器對象模型（BOM）
- 瀏覽器對象模型（Browser Object Model）內(nèi)置了一些對象，用來操作窗口，這些對象包括window、screen、location、navigator、document、xmlhttprequet,雖然該部分沒有規(guī)范，但是，各個瀏覽器都支持這些對象。開發(fā)人員使用BOM可以控制瀏覽器顯示頁面以外的部分。而BOM真正與眾不同的地方（也是經(jīng)常會導(dǎo)致問題的地方），還是它作為JavaScript實現(xiàn)的一部分，至今仍沒有相關(guān)的標(biāo)準(zhǔn)。
可對瀏覽器窗口進(jìn)行訪問和操作，包括：
- 彈出新的瀏覽器窗口。
- 移動、關(guān)閉瀏覽器窗口及調(diào)節(jié)瀏覽器窗口大小。
- 獲取用戶屏幕分辨率的屏幕對象。
- web瀏覽器詳細(xì)的定位對象。
五、使用JavaScript
<Script>標(biāo)簽解析
<script>xxx</script>這組標(biāo)簽，是用于在HTML頁面中插入JS的主要方法。它主要有以下幾個屬性：
- 1、charset：可選。表示通過src屬性指定的字符集。由于大多數(shù)瀏覽器忽略它，所以很少有人用它。
- 2、defer：可選。表示腳本可以延遲到文檔完全被解析和顯示之后再執(zhí)行。由于大多數(shù)瀏覽器不支持，故很少用。
- 3、language：已廢棄。原來用于代碼使用的腳本語言。由于大多數(shù)瀏覽器忽略它，所以不要用了。
- 4、src：可選。表示包含要執(zhí)行代碼的外部文件。
- 5、type：必需?？梢钥醋魇莑anguage的替代品。表示代碼使用的腳本語言的內(nèi)容類型。范例：type="text/javascript"
<scripe>標(biāo)簽示例：
<script type="text/javascript">
?? alert('歡迎來到JavaScript世界!');
</script>六、JavaScript使用方式：
1、事件定義式：在定義事件時直接寫入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="點(diǎn)擊" onclick="alert('我被點(diǎn)擊了')" />
</body>
</html>效果：
2、直接嵌入式：在網(wǎng)頁中直接嵌入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="點(diǎn)擊" onclick="btnClick()" />
<script>
alert("我是寫在body里面的JavaScript");
</script>
</body>
</html>效果：
注意：
- 使用直接嵌入式的時候，JavaScript腳本可以寫在<head>標(biāo)簽里面，也可以寫在<body>標(biāo)簽里面。
3、文件調(diào)用式：在網(wǎng)頁中調(diào)用獨(dú)立的JavaScript文件。把js代碼寫在單獨(dú)的一個js文件中，通過src屬性引入即可。它具有維護(hù)性高、可緩存（加載一次，無需再次加載）、方便未來擴(kuò)展的特點(diǎn)。
例如：
<!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>文件調(diào)用式</title>
<script src="../demo.js"></script>
</head>
<body>
<input type="button" value="點(diǎn)擊" onclick="btnClick()" />
</body>
</html>注意：
- 1、使用外部樣式引入js，雖然沒有任何代碼了，但也不能使用單標(biāo)簽：
<script type="text/javascript" src="demo.js"/> - 2、不能再里面添加任何代碼，添加的代碼執(zhí)行不到
<script type="text/javascript" src="demo.js">alert('我很可憐，因為執(zhí)行不到')</script>
到此這篇關(guān)于JavaScript基礎(chǔ)與實例的文章就介紹到這了。希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
下面分享網(wǎng)頁全屏顯示代碼，想做全屏顯示效果的朋友可以參照下。2009-07-07
深入document.write()與HTML4.01的非成對標(biāo)簽的詳解
本篇文章對document.write()與HTML4.01的非成對標(biāo)簽進(jìn)行了詳細(xì)的分析介紹。需要的朋友參考下2013-05-05
本文整理匯總了js獲取瀏覽器基本信息資料，非常的全面，也對IE及非IE瀏覽器之間的區(qū)別進(jìn)行了分析，是篇非常不錯的文章，這里推薦給大家，前端設(shè)計師們千萬不要錯過2014-11-11
這篇文章主要介紹了關(guān)于JSON的定義以及如何使用，JSON 的名稱中雖然帶有JavaScript，但這是指其語法規(guī)則是參考JavaScript對象的，而不是指只能用于JavaScript語言,需要的朋友可以參考下2023-07-07
這篇文章主要介紹了淺談javascript 迭代方法的相關(guān)資料,需要的朋友可以參考下2015-01-01
DOM精簡教程...2006-10-10
怎么通過onclick事件獲取js函數(shù)返回值（代碼少）
這篇文章主要介紹了怎么通過onclick事件獲取js函數(shù)返回值,需要的朋友可以參考下2015-07-07
JavaScript中的運(yùn)算符種類及其規(guī)則介紹
JavaScript中的運(yùn)算符有很多，主要分為算術(shù)運(yùn)算符，等同全同運(yùn)算符，比較運(yùn)算符，字符串運(yùn)算符，邏輯運(yùn)算符，賦值運(yùn)算符等，它們都有一個自己的運(yùn)算規(guī)則，在本文為大家介紹下2013-09-09
服務(wù)端 VBScript 與 JScript 幾個相同特性的寫法 By shawl.qiu
服務(wù)端 VBScript 與 JScript 幾個相同特性的寫法 By shawl.qiu...2007-03-03
JavaScript For 循環(huán)...2007-04-04