-
JS的簡(jiǎn)介
概述: JavaScript, 是一門(mén)弱類(lèi)型的語(yǔ)言, 可以給頁(yè)面增加動(dòng)態(tài)效果.
//弱類(lèi)型的語(yǔ)言: 對(duì)數(shù)據(jù)的數(shù)據(jù)類(lèi)型劃分不精細(xì).
//所有的js的變量都用: var這個(gè)運(yùn)算符來(lái)接收.
特點(diǎn):
1) JavaScript 是一種輕量級(jí)的編程語(yǔ)言佛呻。
2) JavaScript 是可插入 HTML 頁(yè)面的編程代碼。
3) JavaScript 插入 HTML 頁(yè)面后，可由所有的現(xiàn)代瀏覽器執(zhí)行断盛。
4) JavaScript 很容易學(xué)習(xí)驱敲。組成:
ECMAScript基礎(chǔ): 定義了JS的核心語(yǔ)法和基本對(duì)象.
BOM: Browser Object Model, 瀏覽器對(duì)象模型.
DOM對(duì)象: Document Object Model, 文檔對(duì)象模型. -
JS的引入方式:
方式一: 直接嵌入到HTML頁(yè)面中.類(lèi)似于CSS的內(nèi)部引入.
寫(xiě)在<head>標(biāo)簽<script>
格式:
<script>
//JS的代碼.
</script>方式二: 寫(xiě)在.js文件中, 然后在頁(yè)面中引入該文件. //類(lèi)似于昨天講解的CSS的外部引入.
引入的格式:
<script src="要引入的js文件的路徑">
</script> -
ECMAScript核心基礎(chǔ)
基礎(chǔ)語(yǔ)法:
1) JS是區(qū)分大小寫(xiě)的.
2) JS是一門(mén)弱類(lèi)型語(yǔ)言, 所有的變量都用var(variable:變量)運(yùn)算符來(lái)接收.
3) JS語(yǔ)句最后邊的分號(hào)可寫(xiě)可不寫(xiě), 建議寫(xiě)上.
4) JS中的注釋方式和Java中的注釋方式類(lèi)似.
//單行注釋
/* 多行注釋 */
5) 由{}括起來(lái)的內(nèi)容是: 代碼塊.變量的命名規(guī)則:
1) 不能以數(shù)字開(kāi)頭.
2) 必須是數(shù)字, 大小寫(xiě)字母, _, $四部分中組成.
3) 不能和關(guān)鍵字重名.
4) 最好做到見(jiàn)名知意.JS中對(duì)值的類(lèi)型進(jìn)行了劃分:
//不同類(lèi)型的值, 在內(nèi)存中的存儲(chǔ)地方是不一樣的.
原始類(lèi)型的值: //可以理解為是Java的基本類(lèi)型.
//原始類(lèi)型的值都存在棧里邊, Null除外(存儲(chǔ)在堆中).
String: 表示字符串, 值用引號(hào)括起來(lái), 單雙引號(hào)均可. //JS是沒(méi)有字符的概念的, 只有字符串.
Number: 表示數(shù)字(所有的整數(shù)和小數(shù))
Boolean: 值只有: true, false.
Null: 值只有一個(gè): null
Undefined: 值只有一個(gè): undefined, 該值是從 null 派生過(guò)來(lái)的.
//當(dāng)聲明的變量未初始化時(shí)，該變量的默認(rèn)值是 undefined卓鹿。String name; //聲明 name = "張三"; //賦值 聲明 + 賦值 = 初始化.
引用類(lèi)型的值:
//存儲(chǔ)在 堆 中.
//所有new出來(lái)的東西, 都存儲(chǔ)在堆中.
var v1 = false; //v1是 原始類(lèi)型的值
var v2 = new Boolean(false); //v2是 引用類(lèi)型的值, Boolean 對(duì)象是 Boolean 原始類(lèi)型的引用類(lèi)型檩电。
var v3 = 10; //v3 原始類(lèi)型的值
var v4 = new Number(10); //v4 引用類(lèi)型的值, Number 對(duì)象是 Number 原始類(lèi)型的引用類(lèi)型
var v5 = "abc"; //v5 原始類(lèi)型的值
var v6 = new String("abc"); //v6 引用類(lèi)型的值, String 對(duì)象是 String 原始類(lèi)型的引用類(lèi)型
我們可以通過(guò)typeof關(guān)鍵字, 來(lái)校驗(yàn)變量或者值是什么類(lèi)型的值:
格式:
typeof 值或者變量名
如果返回值是string, 說(shuō)明是String類(lèi)型的原值值.
如果返回值是number, 說(shuō)明是Number類(lèi)型的原始值.
如果返回值是boolean, 說(shuō)明是Boolean類(lèi)型的原始值.
如果返回值是undefined, 說(shuō)明是Undefined類(lèi)型的原始值.
如果返回值是object, 說(shuō)明是一個(gè)引用類(lèi)型的值或者Null類(lèi)型的原始值.
-
JS中的類(lèi)型轉(zhuǎn)換:
//可以把一下的三個(gè)方法理解為: Java中的隱式類(lèi)型轉(zhuǎn)換.
轉(zhuǎn)成字符串:
變量名.toString();
轉(zhuǎn)成數(shù)字:
parseInt(值), parseFloat(值);強(qiáng)制類(lèi)型轉(zhuǎn)換:
Boolean(給定的值); //把給定的值轉(zhuǎn)成boolean類(lèi)型, 值是非空字符串, 非零數(shù)字, 非null的情況下返回true, 其他返回false.
String(給定的值); //把給定的值轉(zhuǎn)成字符串.
//類(lèi)似于 值.toString()這種方式.
Number(給定的值); //把給定的值轉(zhuǎn)成數(shù)字. 如果給定的值是false和true, 那么則分別轉(zhuǎn)成0和1.
- JS中的關(guān)鍵字和保留字
//和Java中的關(guān)鍵字和保留字非常類(lèi)似.
-
JavaScript中的運(yùn)算符
JavaScript中的運(yùn)算符和Java運(yùn)算符基本一致.
算術(shù)運(yùn)算符:
+, -, *, /, %, ++, --賦值運(yùn)算符:
=, +=, -=, *=, /=, %=比較運(yùn)算符:
>, <, >=, <=, != , ==, ===(全等于)
/*
==和===解釋:
==: 只校驗(yàn)值是否相等.
===(全等于): 既校驗(yàn)值是都相等, 也校驗(yàn)值的類(lèi)型是否相同.
*/
邏輯運(yùn)算符:
&&, ||, !
條件運(yùn)算符: //和Java中的三元運(yùn)算符一樣.
var num = num1 > num2 ? num1 : num2;
逗號(hào)運(yùn)算符:
//相當(dāng)于同時(shí)聲明多個(gè)變量.
var num1 = 1, num2 = 2, num3 = 3;
- JavaScript中的語(yǔ)句
和Java中非常類(lèi)似, 需要注意的是: for循環(huán)的初始化條件的類(lèi)型要寫(xiě)成var.
- JavaScript的事件的概述
概述: 前面編寫(xiě)的JS代碼都是直接在<script>標(biāo)簽中直接寫(xiě)的, 按照?qǐng)?zhí)行的順序來(lái)講, 只要頁(yè)面加載到代碼, 就會(huì)執(zhí)行.這樣寫(xiě)不夠靈活, 一般JS的代碼是由 用戶(hù)某些行為 的觸發(fā)來(lái)執(zhí)行的.這些用戶(hù)的行為, 就是事件.
//學(xué)事件, 就是要知道: 用戶(hù)有哪些行為.
常用事件:
onclick: //鼠標(biāo)單擊事件
ondblclick: //鼠標(biāo)雙擊事件
onmouseover: //鼠標(biāo)懸浮事件
onmousemove: //鼠標(biāo)移動(dòng)事件
onmouseout: //鼠標(biāo)移除事件
onkeyup: //鍵盤(pán)抬起事件
onfocus: //獲取鼠標(biāo)焦點(diǎn)事件
onblur: //失去鼠標(biāo)焦點(diǎn)事件
onchange: //改變事件. 一般用于下拉列表, 可以用來(lái)做菜單聯(lián)動(dòng).
onsubmit: //提交事件. 可以用來(lái)做表單數(shù)據(jù)校驗(yàn).
onload: //頁(yè)面加載事件
//記憶: JS事件一般結(jié)合 JS函數(shù)一起使用.
-
JavaScript的自定義函數(shù)
函數(shù)的定義格式:格式一: 普通定義格式, 直接寫(xiě). //注意: 直接寫(xiě)參數(shù)即可, 不需要寫(xiě)數(shù)據(jù)類(lèi)型. function 函數(shù)名(參數(shù)1, 參數(shù)2){ } //示例: 計(jì)算兩個(gè)數(shù)字的和 function sum(a,b){ return a + b; } 格式二: 匿名函數(shù) //把函數(shù)綁定到事件上. onload = function() { } -
JavaScript的全局函數(shù)
eval(): 將字符串當(dāng)成腳本來(lái)執(zhí)行.
var s = "alert('aaa')";
eval(s);
parseInt(); 轉(zhuǎn)成整數(shù)
parseFloat(); 轉(zhuǎn)成小數(shù)
toString(); 轉(zhuǎn)成字符串encodeURIComponent(); 把字符串編碼為 URI 組件。
decodeURIComponent(); 解碼一個(gè)編碼的 URI 組件现斋。
//Cookie會(huì)用到, 登陸頁(yè)面的時(shí)候, 緩存數(shù)據(jù)可以存在Cookie里邊, 但是Cookie默認(rèn)是不能存中文的, 就可以通過(guò)這兩個(gè)方法對(duì)字符串進(jìn)行編碼和解碼.
-
JavaScript的對(duì)象及數(shù)組
RegExp: 正則對(duì)象.
正則的校驗(yàn)有兩種方式:
String#match();
//字符串.match("正則表達(dá)式");
RegExp#test();
//正則表達(dá)式.test(字符串);數(shù)組的定義:
直接定義: var arr = [1,2,3,"abc",true]; 對(duì)象方式定義: var arr = new Array(); arr[0] = 1; arr[1] = 2; var arr2 = new Array(3); //下邊只能是0,1,2 var arr3 = new Array("a","b","c"); -
JavaScript的BOM對(duì)象
BOM的概述: //Browser Object Model, 瀏覽器對(duì)象模型.
瀏覽器對(duì)象的分類(lèi):Window: Window是瀏覽器對(duì)象中最頂層的對(duì)象, 使用這個(gè)對(duì)象的時(shí)候可以window.xxx也可以將window省略. //即: window.alert()和alert()效果一樣. alert(); 警告框 confirm(); 確認(rèn)框 open(); 打開(kāi)一個(gè)新的瀏覽器窗口或查找一個(gè)已命名的窗口 close(); 關(guān)閉瀏覽器窗口喜最。 prompt(); //提示用戶(hù)錄入數(shù)據(jù) setInterval(); 設(shè)置定時(shí), 循環(huán)執(zhí)行. //用法: setInterval("表達(dá)式", 間隔時(shí)間-毫秒); setTimeOut(); 設(shè)置定時(shí), 執(zhí)行一次. //用法: setTimeOut("表達(dá)式", 間隔時(shí)間-毫秒); clearInterval(); 清除定時(shí) clearTimeOut(); 清除定時(shí) History: 瀏覽器的歷史對(duì)象. go(); Location: 瀏覽器的控制頁(yè)面跳轉(zhuǎn)對(duì)象. href屬性
正則表達(dá)式:
/^[0-9a-zA-Z]{5,16}$/ 字母數(shù)字組成,5-16位,一定要加終止符$,驗(yàn)證用戶(hù)名
/^1[3-9][0-9]{9}$/ 第一位以1開(kāi)頭,第二位在3-9之間,后面9位在0-9之間選擇,驗(yàn)證手機(jī)號(hào)碼
[0-9a-zA-Z_] 也可以寫(xiě)為 \w 字母數(shù)字下劃線(xiàn)
eg: /^\w{5,16}$/