一徒扶、初始JavaScript

JavaScript 是 Web 的編程語言盐欺。
所有現(xiàn)代的 HTML 頁(yè)面都使用 JavaScript蜜唾。
在網(wǎng)頁(yè)中，JavaScript 代碼坡疼，需要在script標(biāo)簽中定義彬呻。
script標(biāo)簽可以放在的網(wǎng)頁(yè)的任何地方，但是柄瑰，通常會(huì)放到body標(biāo)簽的最下方闸氮，
確保JavaScript 代碼，在網(wǎng)頁(yè)的內(nèi)容全部加載完畢后再執(zhí)行教沾。

1.輸出語句

console.log 輸出信息
console.warn 輸出警告信息
console.error 輸出錯(cuò)誤信息
console.table 以表格的方式展開對(duì)象的成員信息
console.time(name) 開始測(cè)試時(shí)間
console.timeEnd(name) 結(jié)束測(cè)試時(shí)間

2.定義變量

(1) 什么變量

就是內(nèi)存中的一個(gè)空間蒲跨，用于存儲(chǔ)數(shù)據(jù)，數(shù)據(jù)的種類是不一樣的授翻，所以對(duì)空間的要求也不一樣或悲。
定義不同類型的變量，其實(shí)就是定義不同的存儲(chǔ)空間堪唐，存儲(chǔ)不同的數(shù)據(jù)巡语。
var是定義變量的關(guān)鍵字，定義變量的方式是：var 變量名 = 變量值淮菠。
變量名就是變量的標(biāo)識(shí)男公，用于之后重新獲取變量里面保存的值。
注意：js是一門弱類型語言合陵，不像java枢赔，C#是強(qiáng)類型語言澄阳。
強(qiáng)類型語言，在定義變量的時(shí)候踏拜，就必須要明確類型碎赢，并且之后不能再改變類型。
弱類型語言速梗，在定義變量的時(shí)候肮塞，不需要明確類型，類型由具體的數(shù)據(jù)確定姻锁，并且之后可以改變類型峦嗤。

(2) 類型

typeof關(guān)鍵字，用于返回變量的數(shù)據(jù)類型

number是數(shù)字類型屋摔，注意：在js中烁设，整型和浮點(diǎn)型的數(shù)據(jù)都是number類型。
string是字符串類型钓试，由一對(duì)雙引號(hào) 或 單引號(hào) 引起來的數(shù)據(jù)都是字符串装黑。
boolean是布爾類型，布爾類型用于表示：真 或 假弓熏。只有兩個(gè)屬性值：true 和 false恋谭。
undefined是未定義類型，變量已經(jīng)定義挽鞠，但是還沒有賦值疚颊。
object是對(duì)象類型，用于定義復(fù)雜的數(shù)據(jù)格式信认。
null是空類型材义，用于表示空對(duì)象，所以嫁赏，null本質(zhì)上也是object類型其掂，但是不具有object默認(rèn)的屬性和行為。
symbol是ES6新增了一個(gè)數(shù)據(jù)類型潦蝇，用于確定一個(gè)唯一的數(shù)據(jù)款熬，通常用于給對(duì)象添加唯一的屬性 或 方法。
ES6指的是ECMAScript2015之后的版本

注意：在js中攘乒，每條語句采用分號(hào)結(jié)尾贤牛，分號(hào)可以省略。

總結(jié)：在js中则酝，數(shù)據(jù)類型一共有7個(gè)殉簸。
分別是：number(數(shù)字類型)，string(字符串類型)，boolean(布爾類型)喂链，undefined(未定義類型)，
object(對(duì)象類型)妥泉，null(空對(duì)象類型)椭微，symbol(唯一值類型)。

3.算術(shù)運(yùn)算符

算術(shù)運(yùn)算符：+ - * / %

注意：字符串 + 任何數(shù)據(jù) 都是拼接盲链，重新返回新的字符串蝇率。

表達(dá)式是從左往右執(zhí)行，當(dāng)遇到字符串時(shí)刽沾，整個(gè)表達(dá)式才當(dāng)做字符串處理本慕。
除法運(yùn)算，除法會(huì)保留小數(shù)侧漓。
parseInt()函數(shù)锅尘，用于取整數(shù)，注意：并不是四舍五入布蔗，而且去掉小數(shù)藤违。
簡(jiǎn)寫形式：
b += a //b = b + a
b -= 10 //b = b - 10
b *= 2 //b = b * 2
b /= 5 //b = b / 5
b %= 3 //b = b % 3
num++ // num = num + 1
++num // ++可以放在變量的后面，也可以放在變量的前面
++在變量的后面纵揍，表示先返回變量的原值顿乒，再加1
++在變量的前面，表示變量的值先加1泽谨，再返回變量的值

<script>
        var num1 = 100;
        var num2 = 200;
        var num3 = "300";
        console.log(num1+num2);                 //300這里的加號(hào)是加法運(yùn)算璧榄。
        console.log(num1+num3);                 //100300這里的加號(hào)是字符串的拼接，因?yàn)楸磉_(dá)式中只要有一個(gè)數(shù)據(jù)是字符串吧雹，整個(gè)表達(dá)式就當(dāng)做字符串處理骨杂。
        console.log(num1+num2+num3);            //300300因?yàn)楸磉_(dá)式是從左往右執(zhí)行，當(dāng)遇到字符串時(shí)雄卷，整個(gè)表達(dá)式才當(dāng)做字符串處理腊脱。
        console.log(num1+num2+num3+num1+num2);  //300300100200整個(gè)表達(dá)式從遇到num3開始，后面的都當(dāng)做字符串處理龙亲。
    </script>

4.比較運(yùn)算符

比較運(yùn)算符：> >= < <= == != ===(全等于陕凹，恒等于) !==(恒不等于)

使用比較運(yùn)算符的表達(dá)式是比較表達(dá)式，比較表達(dá)式返回的數(shù)據(jù)類型是boolean類型

注意：采用==比較兩份數(shù)據(jù)是否相等鳄炉，只比較值杜耙，不比較類型。

注意：采用===比較兩份數(shù)據(jù)是否相等拂盯，值要相等佑女，類型也要相等。

注意：采用!=比較兩份數(shù)據(jù)是否不相等，只比較值团驱，不比較類型摸吠。

注意：采用!==比較兩份數(shù)據(jù)是否不相等，值不相等或者類型不相等嚎花。

5.邏輯運(yùn)算符

邏輯運(yùn)算符：&&（并且） ||（或者） !（取反）

|| 是或運(yùn)算符寸痢，左右兩個(gè)表達(dá)式，其中一個(gè)返回true紊选，整個(gè)表達(dá)式返回true

&& 是與運(yùn)算符啼止，左右兩個(gè)表達(dá)式，都返回true兵罢，整個(gè)表達(dá)式才返回true

! 是非運(yùn)算符献烦，用于將表達(dá)式的值取反值，如果表達(dá)式返回true卖词，取反就是false

6.運(yùn)算符的優(yōu)先級(jí)

運(yùn)算符的優(yōu)先級(jí)：() > 算術(shù)運(yùn)算符 > 關(guān)系運(yùn)算符 > ! > && > ||

7.命名規(guī)范

變量里面保存的是一份數(shù)據(jù)巩那，為了方便將來獲取里面存儲(chǔ)的數(shù)據(jù)，變量名命名一定要規(guī)范此蜈。
就是看到變量名就知道里面存儲(chǔ)的是什么數(shù)據(jù)拢操。（見名知意）

在JS中，變量名的規(guī)范有：
只能使用：字母舶替、數(shù)字令境、_、$ 做為變量名稱顾瞪。
數(shù)字不要開頭舔庶，
不能使用JS的關(guān)鍵字，
多個(gè)單詞組成的變量名陈醒，要使用駝峰命名法惕橙，第一個(gè)單詞的首字母小寫，其余單詞的首字母大寫钉跷。

二弥鹦、選擇結(jié)構(gòu)

1.JavaScript的組成

(1) 三大核心

ESMAScript 核心語法（標(biāo)準(zhǔn)規(guī)范）-> SE6
BOM 瀏覽器對(duì)象模式，其實(shí)就是window對(duì)象爷辙，該對(duì)象可以操作瀏覽器
DOM 文檔對(duì)象模型彬坏，其實(shí)就是document對(duì)象，該對(duì)象可以操作網(wǎng)頁(yè)里面的所有元素

(2) window對(duì)象的常用方法

window.alert()方法膝晾，用于打開消息框
window.prompt()方法栓始，用于打開輸入框，輸入框返回的數(shù)據(jù)的類型是string類型
window.confirm()方法血当，用于打開確定框幻赚，確認(rèn)框里面有兩個(gè)按鈕禀忆，確定和取消，點(diǎn)擊確定按鈕返回true落恼，點(diǎn)擊取消按鈕返回false
window.parseInt()方法箩退，用于將字符串?dāng)?shù)據(jù)，強(qiáng)轉(zhuǎn)為整型
window.parseFloat()方法佳谦，用于將字符串?dāng)?shù)據(jù)戴涝，強(qiáng)轉(zhuǎn)為浮點(diǎn)型
window.isNaN()方法，用于判斷一份數(shù)據(jù)是不是NaN數(shù)據(jù)（not a number）

2.if選擇結(jié)構(gòu)

if選擇結(jié)構(gòu)的語法是：if ( 判斷條件 ) { 滿足條件之后吠昭，執(zhí)行的代碼塊 }
if-else選擇結(jié)構(gòu)，if ( ) 里面的條件成立執(zhí)行 if { } 里面的代碼塊胧瓜，否則執(zhí)行 else { } 里面的代碼塊

注意：當(dāng)if或者else里面只有條件語句的時(shí)候矢棚，可以省略{}
建議：初學(xué)者，不要省略{}

3.多重if選擇結(jié)構(gòu)

多重if選擇結(jié)構(gòu)里面府喳，滿足其中一個(gè)條件蒲肋，執(zhí)行該條件對(duì)應(yīng)的代碼，這個(gè)大括號(hào)下執(zhí)行完成后會(huì)跳出整個(gè)程序結(jié)構(gòu)钝满。
如果所有的條件都不成立兜粘，有else，就執(zhí)行else弯蚜；沒有else孔轴，整個(gè)程序結(jié)構(gòu)結(jié)束。

<script>
        var score = parseInt(prompt('請(qǐng)輸入考試成績(jī)：'));
        // 判斷成績(jī)碎捺，大于等于90分路鹰，獎(jiǎng)勵(lì)手機(jī)一部
        // 大于等于80分，獎(jiǎng)勵(lì)MP4一個(gè)
        // 大于等于70分收厨，獎(jiǎng)勵(lì)MP3一個(gè)
        // 大于等于60分晋柱，沒有任何獎(jiǎng)勵(lì)
        // 小于60分，罰抄代碼50遍
        if (score >= 90) {
            console.log('獎(jiǎng)勵(lì)手機(jī)一部');
        }else if (score >= 80) {
            console.log('獎(jiǎng)勵(lì)MP4一個(gè)');
        }else if (score >= 70) {
            console.log('獎(jiǎng)勵(lì)MP3一個(gè)');
        }else if (score >= 60) {
            console.log('沒有任何獎(jiǎng)勵(lì)');
        }else {
            console.log('罰抄代碼50遍');
        }
    </script>

練習(xí)題：
如果有500萬存款诵叁，買一輛奔馳-邁巴赫S600
如果有300萬存款雁竞，買一輛寶馬740
如果有100萬存款，買一輛奧迪A6L
如果有50萬存款拧额，買一輛大眾途觀L
如果有10萬存款碑诉，買一輛奧拓
否則，買一輛捷安特

4.嵌套if選擇結(jié)構(gòu)

嵌套if選擇結(jié)構(gòu)：就是在一個(gè)完整的if或者else的結(jié)構(gòu)中侥锦，繼續(xù)使用if結(jié)構(gòu)語句联贩。

<script>
// 問題分析：
// 百米成績(jī)跑進(jìn)12秒，進(jìn)入決賽捎拯，否則直接淘汰
// 進(jìn)入決賽后泪幌，再根據(jù)需求分組盲厌，分男子組和女子組
var score = parseFloat(prompt('請(qǐng)輸入百米成績(jī)：'));
if (score < 12) {
    console.log('進(jìn)入決賽...');
    var sex = prompt('請(qǐng)輸入性別');
    if (sex === '男') {
         console.log('進(jìn)入男子組...');
     }else {
         console.log('進(jìn)入女子組...');
     }
}else {
     console.log('直接淘汰！');
}
</script>

練習(xí)題：
請(qǐng)輸入是否是會(huì)員祸泪，輸入y是會(huì)員吗浩，輸入n不是會(huì)員
請(qǐng)輸入消費(fèi)金額
會(huì)員：消費(fèi)打8折，滿100元打6折
非會(huì)員：消費(fèi)滿200元打9折没隘，不滿200元不打折
最后輸出本次實(shí)際消費(fèi)金額

多重if和嵌套if的綜合練習(xí)題：
輸入年 月 輸出該月份有多少天懂扼？
閏年公式：年份能被4整除，但不能被100整除右蒲；或者年份能被400整除阀湿。閏年的2月份是29天，平年的2月份是28天瑰妄。

5.switch選擇結(jié)構(gòu)

switch選擇結(jié)構(gòu)陷嘴，也是用于進(jìn)行多分支判斷，語法結(jié)構(gòu)比多重if簡(jiǎn)潔间坐。
但是灾挨，switch選擇結(jié)構(gòu)只能進(jìn)行等值判斷。
語法結(jié)構(gòu)是：將需要進(jìn)行等值判斷的變量竹宋，放到()里面劳澄。在{}里面通過case后面的值跟它進(jìn)行等值判斷。

<script>
    // 請(qǐng)輸入成績(jī)蜈七，第一名獎(jiǎng)勵(lì)手機(jī)一部秒拔，第二名獎(jiǎng)勵(lì)MP4一個(gè)，第三名獎(jiǎng)勵(lì)MP3一個(gè)飒硅，否則沒有獎(jiǎng)勵(lì)溯警。
    var mc = parseInt(prompt('請(qǐng)輸入名次：'));
    if (mc === 1) {
        console.log('獎(jiǎng)勵(lì)手機(jī)一部');
    } else if (mc === 2) {
        console.log('獎(jiǎng)勵(lì)MP4一個(gè)');
    } else if (mc === 3) {
        console.log('獎(jiǎng)勵(lì)MP3一個(gè)');
    } else {
        console.log('沒有獎(jiǎng)勵(lì)');
    }
    console.log('--------------------------');

    switch (mc) {
        case 1:
            console.log('獎(jiǎng)勵(lì)手機(jī)一部');
            break;
        case 2:
            console.log('獎(jiǎng)勵(lì)MP4一個(gè)');
            break;
        case 3:
            console.log('獎(jiǎng)勵(lì)MP3一個(gè)');
            break;
        default:
            console.log('沒有獎(jiǎng)勵(lì)'); 
            break;
    }
</script>

注意1：
case語句，在結(jié)束之前狡相，通常都要加上break梯轻，表示跳出switch選擇結(jié)構(gòu)，因?yàn)椋?br> switch選擇結(jié)構(gòu)尽棕，里面的case一旦判斷成立喳挑，后面的case就不會(huì)再進(jìn)行判斷了。

注意2：
如果多個(gè)case的輸出結(jié)果相同滔悉，可以將多個(gè)case的結(jié)果合并伊诵，并省略前面case的break。

// case語句回官，通常都要加上break結(jié)束曹宴，什么情況下會(huì)不加break
// 題目：超市商品打折。1,3,5面包打5折歉提；2,4,6笛坦，可樂買一送一区转；周日，全場(chǎng)5折
var weekDay = prompt('請(qǐng)輸入今天是周幾：');
switch (weekDay) {
    case '1':
    case '3':
    case '5':
        console.log('面包打5折');
        break;
    case '2':
    case '4':
    case '6':
        console.log('可樂買一送一');
        break;
    default:
        console.log('全場(chǎng)5折');
        break;
}

6.三元運(yùn)表達(dá)式

三元表達(dá)式版扩，可以簡(jiǎn)化基本的if-else語句結(jié)構(gòu)
var c = a > 10 ? 100 : 200

三元表達(dá)式废离，也可以簡(jiǎn)化復(fù)雜的if-else語句結(jié)構(gòu)
var e = a > 20 ? 200 : (a > 10 ? 100 : 300)

<script>
    // 如果a>10，b賦值100礁芦，否則b賦值200
    var a = 20
    var b;
    if (a > 10) {
        b = 100;
    } else {
        b = 200;
    }
    console.log(b);
    console.log('--------------');
    // 三元表達(dá)式蜻韭，可以簡(jiǎn)化基本的if-else語句結(jié)構(gòu)
    var c = a > 10 ? 100 : 200
    console.log(c);
    console.log('--------------');
    // 如果a>10，d賦值100柿扣，如果a>20肖方，d賦值200，否則d賦值300
    var d;
    if (a > 20) {
        d = 200;
    } else if (a > 10) {
        d = 100;
    } else {
        d = 300;
    }
    console.log(d);
    console.log('--------------');
    // 三元表達(dá)式未状，也可以簡(jiǎn)化復(fù)雜的if-else語句結(jié)構(gòu)
    var e = a > 20 ? 200 : (a > 10 ? 100 : 300);
    console.log(e);
</script>