前言：“成功沒(méi)有捷徑，腳踏實(shí)地一步一個(gè)腳印，該來(lái)的總會(huì)來(lái)，不好高騖遠(yuǎn)，不急功近利，付出總會(huì)有回報(bào)，不管處于哪個(gè)階段，都要一步一個(gè)腳印，踏實(shí)的走好每一步！”
你好，我是夢(mèng)陽(yáng)辰！快和我一起走進(jìn)JavaScript的世界吧。
01.JavaScript概述
02.HTML中嵌入JavaScript
03.JavaScript標(biāo)識(shí)符和變量
04.函數(shù)的定義和使用
05.JS的數(shù)據(jù)類型
????1.number數(shù)據(jù)類型
????2.boolean數(shù)據(jù)類型
????3.String數(shù)據(jù)類型
????4.Object數(shù)據(jù)類型
06.在JS當(dāng)中怎么定義類？怎么new對(duì)象？
07.null,undefined,NaN的區(qū)別
01.JavaScript概述
1.什么是JavaScript?
JavaScript是運(yùn)行在瀏覽器上的腳本語(yǔ)言。簡(jiǎn)稱JS。
JavaScript是王景公司（NetScape)的?布蘭登·艾奇?開(kāi)發(fā)的，最初叫做LiveScript。LiveScript的出現(xiàn)讓瀏覽器更加生動(dòng)，使得頁(yè)面更具有交互性。
JavaScript（簡(jiǎn)稱“JS”） 是一種具有函數(shù)優(yōu)先的輕量級(jí)，解釋型或即時(shí)編譯型的編程語(yǔ)言。雖然它是作為開(kāi)發(fā)Web頁(yè)面的腳本語(yǔ)言而出名的，但是它也被用到了很多非瀏覽器環(huán)境中，JavaScript 基于原型編程、多范式的動(dòng)態(tài)腳本語(yǔ)言，并且支持面向?qū)ο?、命令式和聲明式（如函?shù)式編程）風(fēng)格。
JavaScript在1995年由Netscape公司的Brendan Eich，在網(wǎng)景導(dǎo)航者瀏覽器上首次設(shè)計(jì)實(shí)現(xiàn)而成。因?yàn)镹etscape與Sun合作，Netscape管理層希望它外觀看起來(lái)像Java，因此取名為JavaScript。但實(shí)際上它的語(yǔ)法風(fēng)格與Self及Scheme較為接近。
JavaScript和java沒(méi)有任何關(guān)系，只是語(yǔ)法類似。JavaScript運(yùn)行在瀏覽器中，代碼由瀏覽器解釋后執(zhí)行。而Java運(yùn)行在JVM中。
JavaScript的“目標(biāo)程序”以普通文本形式保存，這種語(yǔ)言都叫做"腳本語(yǔ)言“。
Java的目標(biāo)程序已.class形式存在，不能使用文本編輯器打開(kāi)，不是腳本語(yǔ)言。
1998年網(wǎng)景公司由“美國(guó)在線”公司收購(gòu)。
王景公司最著名的就是“領(lǐng)航者瀏覽器”：Navigator瀏覽器。
LiveScript的出現(xiàn)，最初的時(shí)候是為Navigator瀏覽器量身定制一門(mén)語(yǔ)言，不支持其他瀏覽器。
微軟一看不行，研發(fā)了只支持IE瀏覽器的腳本語(yǔ)言。JScript。
在兩者語(yǔ)言共存的時(shí)代，程序員需要寫(xiě)兩套程序。這時(shí)一個(gè)叫做ECMA組織（歐洲計(jì)算機(jī)協(xié)會(huì)）根據(jù)JavaScript制定了ECMA-262標(biāo)準(zhǔn)，叫做ECMA-Script.
02.HTML中嵌入JavaScript
1.HTML嵌入JavaScript的第一種方式
JS是一門(mén)事件驅(qū)動(dòng)型的編程語(yǔ)言，依靠時(shí)間去驅(qū)動(dòng)，然后執(zhí)行對(duì)應(yīng)的程序。在JS中有很多事件，其中一個(gè)事件叫做：鼠標(biāo)單擊，單詞：click。并且任何事件都會(huì)對(duì)應(yīng)一個(gè)事件句柄叫做：onclick。【注意：事件和事件句柄的區(qū)別是：事件句柄是在事件單詞前添加一個(gè)on】，而事件是以HTML標(biāo)簽的屬性存在的。
onclick="js代碼“，執(zhí)行原理是什么？
頁(yè)面打開(kāi)的時(shí)候，js代碼并不會(huì)執(zhí)行，只是把這段代碼注冊(cè)到按鈕的click事件上了。等這個(gè)按鈕發(fā)生click之后，注冊(cè)在onclick后面的js代碼會(huì)被瀏覽器自動(dòng)調(diào)用。
*怎么使用JS代碼彈出消息框。
在JS中有一個(gè)內(nèi)置對(duì)象叫做window,全部小寫(xiě)，可以直接拿來(lái)使用，window代表的是瀏覽器對(duì)象。
*window對(duì)象有一個(gè)函數(shù)叫做：alert，用法是：window.alert("消息”）;這樣就可以彈窗了。
*JS的字符串可以使用雙引號(hào)，也可以使用單引號(hào)。
*JS的一條語(yǔ)句結(jié)束之后可以使用分號(hào)“；”,也可以不使用。
舉例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML中嵌入JavaScript的第一種方式</title>
</head>
<body>
<!--點(diǎn)擊按鈕彈出消息框-->
<input type="button" value="Hello" onclick="window.alert('Hello JavaScript!')"/>
<input type="button" value="Hello" onclick="window.alert('Hello XingKong!')"/>
<input type="button" value="Hello" onclick="window.alert ('Hello MengYangChen');
alert('Hello MengYang')
alert('Hello Meng')"/>
</body>
</html>
2.HTML嵌入JavaScript的第二種方式
采用腳本塊的方式：
暴露在腳本塊中的程序，在頁(yè)面打開(kāi)的時(shí)候執(zhí)行，并且遵守自上而下的順序依次逐行執(zhí)行。（不需要事件）
JavaScript腳本塊可以出現(xiàn)在任何位置，并且可以出現(xiàn)多次。
aler函數(shù)會(huì)阻塞整個(gè)HTML頁(yè)面的加載。
注釋語(yǔ)法跟Java一樣。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML嵌入JavaScript的第二種方式</title>
</head>
<body>
<input type="button" value="我是一個(gè)。。"/>
<script type="text/javascript">
window.alert("hello world!");
</script>
<input type="button" value="我是一個(gè)按鈕對(duì)象"/>
</body>
</html>
3.HTML嵌入JavaScript的第三種方式（推薦）
引入外部的js文件。
引入js腳本文件的語(yǔ)句：
同一個(gè)腳本文件可以引入多次。
腳本文件直接寫(xiě)語(yǔ)句就好了。
<script type="text/javascript" src="路徑和文件名“></script>
結(jié)束的< /script>標(biāo)簽必須有，不能用反斜杠取代，引入文件時(shí)，其中間的代碼不會(huì)執(zhí)行。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML中嵌入JavaScript的第三種方式</title>
</head>
<body>
<script type="text/javascript" src="file/JS1.js"></script>
</body>
</html>
03.JavaScript標(biāo)識(shí)符和變量
1.標(biāo)識(shí)符的命名規(guī)則跟Java相同。
2.變量：
聲明變量：
var 變量名；
賦值：
變量名=值
javascript是一種弱類型語(yǔ)言，沒(méi)有編譯階段，一個(gè)變量可以隨意給其賦值。什么類型的都可以。
變量沒(méi)有手動(dòng)賦值時(shí)，默認(rèn)賦值為：undefined。
未聲明變量使用會(huì)報(bào)錯(cuò)。
2.局部變量和全局變量
類似C語(yǔ)言：
全局變量在函數(shù)體之外聲明。瀏覽器關(guān)閉的時(shí)候才會(huì)銷毀。
局部變量:在函數(shù)體內(nèi)部聲明。在函數(shù)體執(zhí)行完后才銷毀。
04.函數(shù)的定義和使用
1.JS中的函數(shù)怎么定義呢?
語(yǔ)法格式：
第一種方式：
function 函數(shù)名（形式參數(shù)列表）{
函數(shù)體；
}
第二種方式：
函數(shù)名=function(形式參數(shù)列表）{
函數(shù)體；
}
JS中的函數(shù)不需要指定返回值類型，返回什么類型的數(shù)據(jù)都沒(méi)問(wèn)題。
函數(shù)的形參也不需要聲明。
如：
<script>
function sum (a,b){
alert(a+b);
}
//或者
sum=function(a,b){
alert(a+b);
}
</script>
在調(diào)用函數(shù)的時(shí)候，如果沒(méi)有傳參數(shù)的值，或則傳了一部分，剩下未傳的參數(shù)默認(rèn)賦值undefined。
NaN是一個(gè)具體的值，該值表示不是數(shù)字。
如果實(shí)參的數(shù)量大于形式參數(shù)的個(gè)數(shù)，默認(rèn)只取前面兩個(gè)數(shù)據(jù)。即沒(méi)有數(shù)量限制（弱類型語(yǔ)言）。因此可以看出，JS不需要重載。
2.JS的函數(shù)不能重載。
如果出現(xiàn)同名函數(shù)，后面定義的函數(shù)會(huì)把前面定義的函數(shù)覆蓋。
因此JS函數(shù)不能重名。分辨函數(shù)就是根據(jù)函數(shù)名來(lái)分辨。
05.JS的數(shù)據(jù)類型
1.JS數(shù)據(jù)類型有:原始類型，應(yīng)用類型。
原始類型：Undefined,Number,String,Boolean,Null
引用類型:Object以及子類。
2.在ES6規(guī)范后，又基于以上6種類型添加了一種新的類型：Symbol。
3.JS中有一個(gè)運(yùn)算符叫做typeof,這個(gè)運(yùn)算符可以在程序的運(yùn)行階段動(dòng)態(tài)地獲取變量的數(shù)據(jù)類型。
typeof運(yùn)算符的語(yǔ)法格式：
typeof 變量名
typeof運(yùn)算符的運(yùn)算結(jié)果時(shí)以下6個(gè)字符串(全小寫(xiě)）結(jié)果之一：
“undefined"
“number”
“string”
“boolean”
“object”
“function”
var d=null;
alert(typeof d);//“object”
比較字符串是否相等用雙等號(hào)。
4.Undefined數(shù)據(jù)類型只有一個(gè)值。這個(gè)值就是undefined，當(dāng)一個(gè)變量沒(méi)有手動(dòng)賦值，系統(tǒng)默認(rèn)賦值為undefined，當(dāng)然也可以手動(dòng)賦值為undefined。
1.number數(shù)據(jù)類型
如：NaN，表示Not a Number不是一個(gè)數(shù)字，但是屬于Number類型。
Infinity，表示無(wú)窮大。
0,-1,123,…小數(shù)，復(fù)數(shù)，無(wú)窮大都是屬于number類型。
除數(shù)為0時(shí)，結(jié)果為無(wú)窮大。
函數(shù)isNaN（數(shù)據(jù)）：結(jié)果為true表示不是一個(gè)數(shù)字。
parseInt()函數(shù)：可以將字符串自動(dòng)轉(zhuǎn)換成數(shù)字。保留Int
parseFloat()函數(shù)：將字符串轉(zhuǎn)換成數(shù)字。
Math.Ceil()函數(shù)：向上取整。2.1會(huì)變?yōu)?。
2.boolean數(shù)據(jù)類型
在boolean類型中有一個(gè)Boolean（）函數(shù)，會(huì)將非boolean類型，轉(zhuǎn)換成boolean類型。
當(dāng)某個(gè)地方一定是boolean類型時(shí)，會(huì)自動(dòng)轉(zhuǎn)換成boolean類型。例如if后面的括號(hào)。
NaN,0,"",null,undefined會(huì)自動(dòng)轉(zhuǎn)換成false.
3.String數(shù)據(jù)類型
1.在JS當(dāng)中字符串可以使用單引號(hào)和雙引號(hào)。
2.在JS當(dāng)中，怎么創(chuàng)建字符串對(duì)象
第一種：var s=“sag”;（小String，屬于String類型）
第二種：var a2= new String(“ab”);（大String，屬于Object類型）
Sting是一個(gè)內(nèi)置的類，可以直接使用。
3.無(wú)論是小String還是大Sting字符串的長(zhǎng)度相同。其中又一個(gè)length屬性求長(zhǎng)度(x.length)
常用函數(shù)：
indexof: 獲取指定字符串在當(dāng)前字符串中第一次出現(xiàn)的索引
lastIndexof
replace
substr
substring
toLowerCase
toUpperCase
spilt 拆分字符串
例如:alert(“fasdf".indexof(“sdf”));
replace只替換最前面一個(gè)子字符串
如果想全部替換需要使用正則表達(dá)式。
substr和substring的區(qū)別。
substr(startIndex length)
substring(startIndex endIndex)左閉右開(kāi)。
4.Object數(shù)據(jù)類型
1.首先Object類型是所有類型的超類，自定義的任何類型，默認(rèn)繼承Object。
2.Object的prototype屬性
作用：給類動(dòng)態(tài)地?cái)U(kuò)展屬性和函數(shù)。
3.Object類的函數(shù)：
toString()
valueof()
toLocalString()
4.在JS中定義的類默認(rèn)繼承Object的屬性和函數(shù)。
06.在JS當(dāng)中怎么定義類？怎么new對(duì)象？
1.定義類的語(yǔ)法：
第一種方式：
function 類名（形參）{
}
第二種方式：
類名 function (形參）{
}
小朋友你是不是有很多問(wèn)號(hào)？這不是函數(shù)的定義方式么？
注意：用了new就是把他當(dāng)作類看，如果沒(méi)有new則是把它當(dāng)作普通的函數(shù)看待。
創(chuàng)建對(duì)象的語(yǔ)法：
new 構(gòu)造函數(shù)名（實(shí)參）；//構(gòu)造函數(shù)和類名一致
2.JS中類的定義，同時(shí)又是一個(gè)構(gòu)造函數(shù)的定義
在JS中類的定義和構(gòu)造函數(shù)的定義是放在一起來(lái)完成的。
如：
function User(a,b,c){
this.sno =a;
this.sname=b;
this.sage=c;
}
//a,b,c是形參，屬于局部變量
//聲明屬性（this 表示當(dāng)前對(duì)象）
//User類中有三個(gè)屬性：sno/sname/sage
3.創(chuàng)建對(duì)象：
var u1 = new User(111,“l(fā)isi”,30)
4.訪問(wèn)對(duì)象的屬性：
alert(u1.sno)
alert(u1.sname)
alert(u1.sage)
或者用另一種語(yǔ)法訪問(wèn)屬性：
alert(u1[“sno”]);
alert(u1[“sage”]);
定義類的另一種語(yǔ)法：
Emp = function (ename ,sal)
this.ename =ename;
this.sal=sal;
}
5.在類中如何定義函數(shù):
Product = function(pno,pname,price){
//屬性
this.pno=pno;
this.pname=pname;
this.price=price;
//函數(shù)
this.getPrice =function(){
return this.price
}
//new對(duì)象
var pro = new Product(111,"西瓜",4.0)
//調(diào)用函數(shù)
var pri = pro.getPrice();
alert(pri);//4.0
6.通過(guò)prototype這個(gè)屬性來(lái)動(dòng)態(tài)擴(kuò)展屬性以及函數(shù)
//給Product類擴(kuò)展函數(shù)：
Product.prototype.getPname=function(){
return this.pname;
}
//給String類擴(kuò)展函數(shù)
String.prototype.getPname=function(){
alert(“Hello”);
}
07.null,undefined,NaN的區(qū)別
1.數(shù)據(jù)類型不一致
alert(typeof null);//Object
alert(typeof NaN);//number
alert(typeof undefined);//undefined
2.null和undefined可以等同
alert(null=NaN);//false
alert(null=undefined);//true
alert(underfined=NaN);false
在JS當(dāng)中有兩個(gè)比較特殊的運(yùn)算符：
1."==" :等同運(yùn)算符：只判斷值是否相等（雙等號(hào)）
2."= = ="：全等運(yùn)算符：既判斷值是否相等，又判斷數(shù)據(jù)類型是否相等。（三等號(hào)）
alert(11 == ture);//true
alert(11=== ture);//false
對(duì)于this等內(nèi)容學(xué)過(guò)Java的就應(yīng)該秒懂，如果你沒(méi)有學(xué)Java，建議看看夢(mèng)陽(yáng)辰 寫(xiě)的Java專欄。
夢(mèng)陽(yáng)辰的Java專欄
至此JavaScript的入門(mén)教程結(jié)束：感謝看到這里！別忘了素質(zhì)三連?。?/p>
