[TOC] * * * * * # 1.JavaScript簡介 * * * * * ## 1.簡介 ### A.誕生的背景 1995年網景公司開發的 開發目的:受制于當時的帶寬,做表單驗證 97年被提交給ECMA,98年獲取ISO認證 ### B.功能 a.數據處理 b.用戶交互 c.服務器端開發 # 2.JavaScript組成 * * * * *  # 3.JavaScript語法 * * * * * #### 1.注釋 //單行注釋 /**/多行注釋 #### 2.什么是標示符 變量,函數,屬性的名字，或者函數的參數。 標示符的命名規則： a.由字母,數字，下劃線(_)或美元符號($)組成 b.不能以數字開頭 c.不能使用關鍵字，保留字作為標示符 d.不能包含算術運算符,或特殊字符(#,etc) ### 3.1 變量 * * * * * ECMAScript的變量是松散類型 松散類型:可以用來保存任何類型的數據 什么是變量? 從字面上看，變量是可變的量； 從編程角度講，JavaScript變量是存儲數據值的容器。 如何使用:聲明 賦值 取值 //var a;使用var關鍵字進行聲明 //= 使用等于號進取賦值 a.變量可以先聲明,再賦值 b.也可以聲明的同時賦值 ~~~ var a = 10; ~~~ ### 3.2數據類型 * * * * * ~~~ 1.數據類型 2.typeof instanceof ~~~ #### A.數據類型的分類 - >1.1原始類型:number,string,boolean,undefined,null ~~~ a.number var a =10,b=20.1; b.string //用單引號或雙引號包裹的叫string類型 var c= “hello world”; var c = 'good'; c.boolean //只有兩個值true或false d.undefined var a; //一個變量之聲明未賦值就是undefined e.null 1.null值表示一個空對象 2.如果定義的變量準備在將來用來保存對象,那么最好將改變量初始化null而不是其他值 使用typeof操作符來識別基本類型 ~~~ - >1.2 引用數據類型:array,object,function > ### array ``` //聲明變量 var arr = [1,2,3,4] //獲取數組的長度 arr.length //讀取數組的值(數組的下標從0開始) arr[index] //向數組的末尾添加值 arr[arr.length]=5; ``` > ### object ``` //聲明對象 var chengchao = { name:”chengchao”, age:20 } //讀取變量的屬性 console.log(chengchao.name); ``` >### function ~~~ //定義:封裝特點功能的代碼塊 //聲明函數 function a(){ console.log(“hello world”) } //調用函數 a(); ~~~ >聲明提前 ~~~ 在正式執行腳本之前，將所有var聲明的變量，提前預讀到(當前作用域的)頂部，集中聲明創建。 然后再開始執行程序。 ***賦值留在本地。 ~~~ ~~~ eg: console.log(a); //undefined var a=10; ~~~ > 全局變量和局部變量 ~~~ 全局變量:在函數外聲明的變量 局部變量:在函數內部聲明的變量 ~~~ # 4.數據類型的轉換 * * * * * ### 4.1強制轉換 ~~~ String,Boolean-->number 任意-->數字：Number(); Number(true) //1; Number(false) //0; //只能識別純數值的字符串 var a = "20"; var b = "hello world"; console.log(Number(a));// 20; console.log(Number(b)); //NaN ~~~ ### 4.2自動轉換 > 定義:不需要程序員干預，js自動完成的類型轉換 算數計算中的自動轉換： #### 1.[算數計算]()中，數據都默認轉為[數字]()，再計算,不能轉為數字則為NaN ~~~ Boolean類型：true-->1 false-->0 eg: var a=1; var b=true; var c = "hello world"; console.log(a+b); //2 console.log(a-c); //NaN ~~~ #### 2.[特殊]()+運算中，碰到字符串，+就變為字符串拼接 另一個不是字符串的數據，被自動轉為字符串 比較運算(>,<,>=,<=,==,!=)中的自動轉換： 默認將所有類型轉為數字再比較 將兩個值做比較-->返回值：true、false ### 4.3強制轉換 >#### 1. 任意-->[數字]()：3個API a.特點:只能識別純數字的字符串 ``` Number(x) eg： var a ="20"; console.log(Number(a)) //只能識別這樣的字符串 ``` b. [將字符串轉為數字]()：2個API parseInt(str): 從第一個字符開始依次讀取每個數字,只要碰上第一個非數字字符就停止,自動跳過開頭的空字符 ***[不識別小數點]() > Tip:何時使用：將字符串轉為整數時 ~~~ var width="20px"; console.log(Number(width)) //NaN console.log(parseInt(width)) //20 ~~~ parseFloat(str):用法同parseInt >比較Number()和parseInt() ~~~ var b=true; console.log(Number(b)) //1 console.log(parseInt(String(b))) //NaN ~~~ >#### 2. 任意類型-->字符串：2個API ~~~ x.toString(); x不是undefined或null時，才可用 String(x) ~~~ >#### 3.任意類型-->Boolean: Boolean(x) ~~~ 只有5個值轉為false： "" NaN undefined null 0 其余都轉為true ~~~ # 5.運算符和表達式 * * * * * ### 5.1算術運算 ~~~ +,-,*,/,%,++,-- ~~~ ### 5.2比較運算:將兩個值做比較-->返回值：true、false ~~~ >,<,>=,<=,==,!= ~~~ >Tip: ***比較運算中： a. 默認將所有類型轉為數字再比較 [特殊情況]() NaN：NaN不等于，不大于，不小于任何值（包括自己） NaN和任何數據做!=比較時，始終返回true isNaN(n):本意是判斷一個值是否是NaN ### 5.3邏輯運算：將多個關系運算綜合起來，得出最終結論，返回值:true、false ~~~ && || ! ~~~ ### 5.4賦值運算 ~~~ += -= *= /= %= ~~~ ### 5.5三目運算 ~~~ var a=(10>4)?10:4； ~~~ # 6.遞增和遞減 ### 6.1遞增 a++和++a; #### 1.單獨使用a都會加一 ``` eg: var a=10; a++ ``` #### 2.在表達式中使用 - 前加加,a自增后運算 - 后加價,a先運算后自增 ~~~ var a=10; var b; b=a++; console.log(b) //10; ~~~ ### 6.2遞減 同上 ## 例子 ~~~ var a = parseInt(window.prompt("請輸入年齡")); if(a>18){ alert("成年人") }else if(a>12){ alert("青年人") } ~~~ ~~~ var a = window.confirm("你是否選擇購買"); console.log(a); ~~~