寫在前面:本文用于快速學會簡易的JS,僅做掃盲和參考作用
1.JS是什么
JavaScript是一門跨平臺,面向?qū)ο蟮哪_本語言(即不需要編譯,可以直接通過瀏覽器進行解釋)。JS和Java是兩門完全不相同的語言,但是基礎(chǔ)的語法是類似的
2.JS的引入方式
JS如何在前端代碼里面體現(xiàn)作用。有兩種方式,一種是內(nèi)部腳本,一種是外部腳本
注意,JS代碼必須放在 script標簽里面,一個頁面可以放置任意數(shù)量的script,一般建議把js放在body的后面,這樣可以改善頁面顯示的速度。js可以放在html頁面的任意位置,不影響他的使用(即使放在html標簽的后面也可以正常運行)
2.1內(nèi)部腳本:將JS代碼寫在HTML里面
內(nèi)部腳本調(diào)用如下所示:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
alert("JS is")
</script>
</head>
<body>
</body>
</html>
效果如下所示:
證明了JS代碼運行成功
2.外部腳本:將JS代碼定義在一個新的文件里
類似于其他語言庫的定義,即將需要執(zhí)行的JS代碼放在一個新的js文件里,然后通過調(diào)用的方式來執(zhí)行js的的代碼。
首先,我們創(chuàng)建一個新的叫jswai.js的文件,并輸入以下內(nèi)容。
alert("in js")
然后再html頁面做這樣引用,通過script里面的src的效果可以達到與內(nèi)部調(diào)用一樣的效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="jswai.js"></script>
</head>
<body>
</body>
</html>
<script>
alert("JS is")
</script>
需要額外注意的是,script標簽無法實現(xiàn)自閉和,即使用了script必須要使用對應(yīng)的/script,不然會導(dǎo)致js腳本執(zhí)行不成功
3.JS基礎(chǔ)語法
3.1書寫語法
3.1.1 區(qū)別大小寫(即變量A和a不是一個變量)
3.1.2 每行結(jié)尾的分號可有可無,即支持c++每行必須有;也支持python的不需要;
3.1.3 單行注釋//,多行注釋為/**/
3.1.4 大括號表示代碼塊,和眾多強語言一樣
常用的輸出語句(類似于c++的printf):
- window.alert():顯示到彈出框上,上面在內(nèi)部腳本調(diào)用的時候已經(jīng)看到了效果圖
- document.write():顯示到html頁面上,即直接運行出來的結(jié)果變成html,顯示到瀏覽器里面
- console.log():寫在了瀏覽器控制臺上,使用f12打開console即可看到輸出效果
3.2變量
可以直接使用var來聲明變量,這個變量可以存放不同類型的值,變量的名稱可以用數(shù)字、字母、_(下劃線)、和$來表示,但是在定義的時候不可以使用數(shù)字作為開頭(和別的語言一樣),var定義的變量可以支持下面操作:
var a=1
a ="123"
var的作用域?qū)儆谌肿兞?,類似于c++里面的#define,不僅僅代碼塊可以調(diào)用,代碼塊外面的代碼也可以進行調(diào)用。如果只想被代碼塊里面調(diào)用,而不想被外面的代碼調(diào)用,可以用let替換var,如果要設(shè)置一個不可變換的常量值,可以使用const(這一點和c++保持一個特性),并且let不可以重復(fù)定義一個變量。即執(zhí)行下面這段代碼會發(fā)生報錯
let a=1
let a=2
雖然運行起來反應(yīng)到瀏覽器上沒有顯示效果,但其實f12打開開發(fā)者工具后,可以看到j(luò)s代碼已經(jīng)執(zhí)行錯誤了。(如果這段script里面后續(xù)還有代碼,則后續(xù)代碼不會執(zhí)行[因為已經(jīng)報錯了],但是如果在script外面[即script標簽的外面]還有html代碼,則html代碼會正常的顯示在頁面上)
let可以支持改變值,例如可以這樣而不會造成代碼的報錯
let a=1
a=2
3.3數(shù)據(jù)類型
JS的基礎(chǔ)數(shù)據(jù)類型主要有以下五種:
number:數(shù)字類型
string:字符串類型
boolean:布爾類型
null:空類型
undefined:未初始化類型
使用typeof()可以獲取變量的類型,如下代碼即可獲得
typeof(a)//即可獲得a的數(shù)據(jù)類型
3.4運算符
運算符和java幾乎一樣,但是增添多了一個===。
=== 和 ==的區(qū)別在于 == 會做類型轉(zhuǎn)換, ===不會做類型轉(zhuǎn)換。如下代碼即可弄懂兩者區(qū)別。文章來源:http://www.zghlxwxcb.cn/news/detail-859340.html
var a= 10
var b="10"
if (a==b){
代碼塊一
}
if (a===b){
代碼塊二
}
這個代碼的運行結(jié)果是會執(zhí)行代碼塊一,而不執(zhí)行代碼塊二,第一個直接類型轉(zhuǎn)換使得a和b都是10,所以等式成立。第二個因為類型不符合所以直接if語句不成立導(dǎo)致不執(zhí)行代碼塊二。文章來源地址http://www.zghlxwxcb.cn/news/detail-859340.html
到了這里,關(guān)于JAVA前端快速入門基礎(chǔ)_javascript入門(01)的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!