1)html、css沒有邏輯性
2)javascript基礎
概念: 客戶端腳本語言
運行在客戶端瀏覽器中的,每一個瀏覽器都有javascript的解析引擎;
腳本語言: 不需要編譯,直接就可以被瀏覽器解析執行;
功能:
html: 頁面展示.
css: 頁面控制和樣式佈局.
js: 可以增強用戶和html頁面的交互過程,可以來控制html元素,讓頁面有一些動態效果,增強用戶體驗.
3)js發展歷程:
發展歷程很心酸;
上網很慢;
BBS論壇-->註冊信息-->瀏覽器表單信息 發送給服務器端進行驗證:
一些信息忘記填了,點擊提交後,很慢;
於是人們想設計出來一種語言: 在瀏覽器中運行,不需要和服務器交互,就可以控制html元素,
格式正確,完整-->發送給服務器;
1992年: Nombase,開發第一門客戶端腳本語言,用於表單的校驗,叫: C--,大家並沒有接收它;
1995年: Netscape(網景),借鑑了c--的思想,開發了一門客戶端腳本語言: LiveScript;
sun開發了java,垃圾回收,一處編譯到處運行,垃圾回收等;
於是網景請來了sun的專家,在LiveScript上進行了修改,命名爲: JavaScript,
想借助Java語言火起來,語言相似;
1996年: 微軟推出了IE瀏覽器,抄襲了JavaScript,開發出JScript, IE也火了;
Nombase就改名爲了:ScriptEase,也火起來了;
問題來了,三足鼎立,市場亂了;
1997: ECMA(歐洲計算機製作商協會),出來了一個組織,要製作出來標準ECMAScript,就是所有客戶端
腳本語言的規範;
4)javascript = ECMAScript + Javascript自己特有的東西(BOM+DOM):
2類對象,並不是ECMA定義的;
5)js的組成
(1)ECMAScript: 客戶端腳本語言的標準
2.基本語法:
1.與html的2種結合方式
1.內部的js:
head裏面定義script標籤;
script標籤可以定義在任意位置;
2.外部的js
<script src="xxx">
注意: 但是放的位置會影響執行順序, alert是阻塞的;
因此在js中獲取元素對象時,注意是否能獲取到;
<script標籤可以定義多個;
2.註釋
單行: // xxx
多行: /*
xxx
*/
java中還有個文檔註釋,js沒有;
3.數據類型
js: 原始數據類型(基本數據類型) + 引用數據類型(對象: 基本對象 + BOM對象 + DOM對象)
原始數據類型: 5種
number:數字 整數/小數/Nan(not a number 一個不是數字的數字類型)
typeof(NaN)得到的是number
string:字符串 字符串(js中其實並沒有字符, 單引和雙引號都是字符串)
boolean: true和false
null: 一個對象爲空的佔位符 var obj = null; 但是typeof出來的卻是 object
undefined: 從null演變過來,表示未定義. 一個變量沒有給初始化值,則會被默認賦值爲undefined.
var xxx;
範圍: 比java的4類8種廣泛一點.
但是我們不需要知道類型還是能用好js
java: 基本數據類型 + 對象數據類型
基本數據類型: 4類8種
4.變量
什麼是變量?
變量是一小塊存儲數據的內存空間;
int a = 3; 申請了一塊內存區域,放的3,這塊內存區域的名字通過a可以找到;
java類型是強類型的語言,開闢變量存儲空間時,只能存儲固定類型的數據;
js是弱類型的語言,在開闢變量存儲空間時,不需要規定類型;
語法:
var 變量名 = 初始化值;
輸出到頁面上:
document.write(xxx + "<br>")
我怎麼知道它是number,是字符串等呢? 這需要我們學習一個運算符typeof;
由於js是弱類型語言,那麼我們知道一個變量是什麼類型的;
5.運算符
1.一元運算符
++ -- +(正號)
注意: 如果運算數不是運算符鎖要求的類型,那麼js引擎會自動的將運算數進行類型轉換.
string轉number: 按照字面值轉換. 如果字面值不是數字,則轉爲NaN(不是數字的數字), NaN+1還是NaN
boolean轉number: true轉爲1, false轉爲0
var b = +("123");
alert(b+1); // 124
null和undefined轉數字沒啥意義,得到的也是NaN
2.算數運算符
+ - * / %
3.賦值運算符
= += -=
4.比較運算符
> < >= <= == ===(全等於)
字符串: 按照字典順序比較
java: 類型不同不能比較
js: 類型不同,則先進行轉換再比較:
"123" == 123 true
===: 全等於
在比較之前,先判斷類型,如果類型不一樣,則直接返回false
5.邏輯運算符
&&: 與(短路)
||: 或(短路)
!
其它類型轉boolean:
number: 0或NaN爲假,其它爲真
string: 除了空字符串, 其它都是true
null 和 undefined: 都是false
對象: 所有對象都爲true
使用: if邏輯判斷,防止空指針邏輯
注意: !3
!!flag --> 得到轉換後的boolean值
6.三元運算符
? : 表達式
語法:
表達式 ? 值1 : 值2;
6.流程控制語句
if else
switch:
java能接受的參數類型: byte int short char 枚舉(1.5) String(1.7);
js中: 什麼類型都可以接收;
while
do while
for
7.js中的特殊語法:
(1)如果一行只有一條語句,js可以寫可以不寫分號(但是建議寫);
要麼是分號. 要麼是回車換行符;
(2)全局變量
空格
(2)js對象:
Function:
方法、函數對象
1.創建:
var fun = new Function(形式參數列表,方法體)
2.方法:
3.屬性:
4.特點:
5.調用:
方法名稱(實際參數列表)
注意: 函數.length就可以得到參數個數,證明是函數對象;
js中函數的調用只與方法的名稱有關,和參數列表無關.
方法裏面隱含的內置對象 arguments 接收了所有參數.
java: 方法和函數是對象的一部分;
js: 函數就是一個對象;
*Array
1.創建
Array(xx):
xx只有1個元素代表數組的長度.
xx是多個則代表創建了數組,並且插入了元素.
元素個數可變;
數組越界後,打印的是undefined
a[10] = 'xxx'; a.length將變爲11
2.方法
join(''): 將數組中的元素按照指定的分隔符拼接爲字符串.
push(xx): 往數組中尾巴處,添加元素.
3.屬性
4.特點
Boolean
*Date
創建: var date = new Date();
方法:
toLocalString():
getTime(): 1970~現在的毫秒值
*Math
創建: Math對象不用創建,直接使用. Math.方法名()
方法:
random: [0,1)
ceil: 向上取整 天花板的意思
floor: 向下取整
round: 4舍5入的整數
案例: [1, 100]的整數
Math.floor(Math.random() * 100) + 1
Number
String
*RegExp (表單校驗依賴於正則表達式)
正則表達式: 定義字符串的組成規則.
如何定義正則表達式?
1.單個字符 []
如[a] a
[ab] a或者b
[a-z] a~z的任意字符
[a-zA-Z0-9] a~z A~Z 0~9 這個集合中的任意一個字符
2. 由於方法1表達的過於麻煩,因此出現了下面的,一下子能表示多個
\d 單個數字字符 [0-9]
\w 單個單詞字符, 等價於[a-zA-Z0-9_]
3.量詞符號
? 表示出現0次或1次
* 表示出現0次或多次
+ 出現1次或多次
舉例: \w* --> 單詞字符組成,出現1次或0次
4.由於方法3量詞符號有點範,因此有了具體的符號.
{m,n} 表示 m<= 數量 <= n
{,n} 表示 最多n次
{m,} 表示 最少m次
舉例: \w{6,12} -->單詞字符出現6~12次
正則表達式對象:
創建的2種方式:
var reg = new RegExp("正則表達式");
var reg = /正則表達式/;
方法:
test(參數): 驗證指定的字符串是否符合正則定義的規範
開始結束符號:
^ 開始
$ 結束
如: /^\w{6,12}$/; -->單詞字符開頭 單詞字符結尾
\\: 由於第一種方式, 轉義符號的原因,\w被轉義爲其它字符了,因此 \\w才行
*Global
特點: 是一個全局對象,這個Global中封裝的方法,我們 方法名() 就可以直接調用這個方法,
而不用通過對象名字.
1.encodeURI(): URL編碼
decodeURI(): URL解碼
2.encodeURLComponent(): URL編碼 編碼的字符更多
decodeURIComponent(): URL解碼
URL編碼介紹: 中文的數據進行轉碼,
傳智播客. GBK 8個二進制位
% 9 5 -->%間隔1個個的字節
3.parseInt(): 字符串轉數字-->逐一判斷每一個字符是否是數字,直到不是數字爲止,將前面數字轉爲num
123abc-->parseInt後得到123 但是用+號轉則是NaN
4.isNaN(): 判斷一個值是否是NaN
NaN六親不認,連自己都不認. NaN參與的 == 比較全部爲false,因此沒有判斷方式判斷是否是NaN,
只能通過這個方法.
5.eval(): 將js的字符串作爲腳本來執行;