Web前端-JavaScript基礎(chǔ)

　　JavaScript基礎(chǔ)概念:客戶(hù)端腳本語(yǔ)言

　　基本概念

　　客戶(hù)端:這里的客戶(hù)端就是瀏覽器

　　腳本語(yǔ)言:不需要編譯,直接就可以被瀏覽器解析執(zhí)行

　　功能:

　　可以增強(qiáng)用戶(hù)和html頁(yè)面的交互過(guò)程,可以控制html元素,讓頁(yè)面有一些動(dòng)態(tài)效果,提高用戶(hù)體驗(yàn)

　　js的組成結(jié)構(gòu)

　　ECMAScript:基礎(chǔ)語(yǔ)法

　　BOM:瀏覽器對(duì)象模型

　　DOM:文檔對(duì)象模型

　　4.js的引入方式:

　　-行內(nèi)式

　　-內(nèi)聯(lián)式

　　定義

　　-注意:

　　一旦引入了一個(gè)script,在標(biāo)簽內(nèi)不可以再寫(xiě)任何js代碼,否則內(nèi)部代碼不生效

　　script標(biāo)簽可以定義在任意位置

　　script標(biāo)簽可以定義多個(gè)

　　html的加載順序:從上到下,從里到外

　　ECMAScript

　　基本語(yǔ)法

　　注釋

　　單行注釋://

　　多行注釋:/**/

　　數(shù)據(jù)類(lèi)型

　　1).原始數(shù)據(jù)類(lèi)型(基本類(lèi)型)

　　-number:數(shù)字 //整數(shù)/小數(shù)/NaN(not a number)

　　-string:字符串 //字符/字符串

　　-boolean:布爾 //true/false

　　-null:一個(gè)對(duì)象為空的占位符

　　-undefined:未定義 //如果一個(gè)對(duì)象沒(méi)有給初始化值,則被默認(rèn)賦值為undefined

　　2).引用數(shù)據(jù)類(lèi)型(對(duì)象)

　　變量

　　1).JavaScript是弱類(lèi)型語(yǔ)言

　　強(qiáng)類(lèi)型:在開(kāi)辟變量存儲(chǔ)空間時(shí),定義了空間將來(lái)存儲(chǔ)的數(shù)據(jù)的數(shù)據(jù)類(lèi)型,只能存儲(chǔ)固定類(lèi)型的數(shù)據(jù)

　　弱類(lèi)型:在申請(qǐng)變量?jī)?nèi)存空間時(shí),不定義空間將來(lái)的存儲(chǔ)類(lèi)型,可以存放任意類(lèi)型的數(shù)據(jù)

　　2).語(yǔ)法

　　var 變量名 = 初始化值;

　　在創(chuàng)建時(shí)可以不定義初始化值.

　　運(yùn)算符

　　1).一元運(yùn)算符: //自增(++)/自減(--)/正號(hào)(+)/負(fù)號(hào)(-)

　　正負(fù)號(hào): 會(huì)引起數(shù)據(jù)類(lèi)型轉(zhuǎn)換(如果+/-后面跟的不是number類(lèi)型)

　　2).算數(shù)運(yùn)算符: //和java一樣 加減乘除

　　3).賦值運(yùn)算符 //和java一樣 =

　　4).比較運(yùn)算符 //和java一樣 ===(全等) !==(不全等)

　　類(lèi)型不同進(jìn)行比較:先進(jìn)行類(lèi)型轉(zhuǎn)換

　　字符串比較-->按照字典逐位比較,直到得出結(jié)果

　　===:在比較之前先判斷類(lèi)型,如果類(lèi)型不一樣則直接返回false

　　!==:只有值和類(lèi)型全相等時(shí)候?yàn)閒alse;

　　5).邏輯運(yùn)算符 //和java一樣 與或非

　　6).三元運(yùn)算符 //和java一樣 條件? 值1:值2

　　!!!注意:在js中如果運(yùn)算數(shù)不是運(yùn)算符所要求的類(lèi)型,那么js的引擎會(huì)自動(dòng)將運(yùn)算數(shù)進(jìn)行類(lèi)型轉(zhuǎn)換

　　*string-->number:按照字面量轉(zhuǎn)化,如果字面量不是數(shù)字,則轉(zhuǎn)為NaN;

　　*boolean-->number:true轉(zhuǎn)為1,false轉(zhuǎn)為0;

　　*null/undefined-->number:NaN

　　*number-->boolean:0為假,非0為真

　　*string-->boolean:""為假,其他為真

　　*null/undefined-->boolean:都為假

　　*對(duì)象-->boolean:所有對(duì)象都為真

　　if(obj) 對(duì)象不為空,字符串長(zhǎng)度>0

　　流程控制語(yǔ)句

　　1).if...else... //和java一樣

　　2).switch

　　在java中,switch語(yǔ)句可以接受的數(shù)據(jù)類(lèi)型:byte short int char,枚舉(1.5) String(1.7)

　　在js中,switch語(yǔ)句可以接受任意類(lèi)型的數(shù)據(jù)

　　3).while

　　4).do...while

　　5).for

　　JS特殊語(yǔ)法(不建議使用)

　　1).語(yǔ)句以分號(hào)結(jié)尾,如果一行只有一條語(yǔ)句,則;可以省略

　　2).變量的定義使用var關(guān)鍵字,也可以不使用

　　-使用var定義的變量是局部變量

　　-不使用var定義的變量時(shí)全局變量

　　注:什么是變量???

　　一小塊存儲(chǔ)數(shù)據(jù)的內(nèi)存空間

　　基本對(duì)象

　　Function:函數(shù)對(duì)象

　　Funciton對(duì)象的創(chuàng)建

　　1).創(chuàng)建:以方法2/3為主,方法1了解即可

　　-方式1:var fun = new Function(形參列表,方法體) 了解即可

　　-方式2:function 方法名(形參列表){函數(shù)體}

　　-方式3:var 方法名 = function(參數(shù)列表){函數(shù)體}

　　2).屬性

　　-length:代表形參的個(gè)數(shù)

　　3).特點(diǎn)****

　　-在創(chuàng)建函數(shù)對(duì)象時(shí),參數(shù)類(lèi)型不用寫(xiě),返回值類(lèi)型

　　-函數(shù)是一個(gè)對(duì)象,如果定義名稱(chēng)相同的函數(shù)則會(huì)覆蓋之前定義的函數(shù)

　　-在JS中函數(shù)的調(diào)用只與方法名稱(chēng)有關(guān),與參數(shù)列表無(wú)關(guān)

　　例:定義了 function fun(a,b,c){函數(shù)體}

　　調(diào)用時(shí)可以使用 fun();/fun(1);/fun(1,2);/fun(1,2,3)/fun(1,2,3,4)

　　-在JS中存在內(nèi)置參數(shù)arguments,它是一個(gè)數(shù)組

　　例:求任意個(gè)數(shù)的和

　　function add(){

　　var sum=0;

　　for(vari=0;i

　　return sum;

　　}

　　Function對(duì)象的調(diào)用

　　var result = 函數(shù)名(參數(shù)...);

　　var s = 函數(shù)名; 將函數(shù)對(duì)象賦給s;

　　Array:數(shù)組對(duì)象

　　數(shù)組對(duì)象的創(chuàng)建

　　- var arr = new Array(元素列表)

　　var arr = new Array(1,2,3);

　　- var arr = new Array(默認(rèn)長(zhǎng)度)

　　var arr = new Array(5);

　　- var arr = [元素列表]

　　var arr = [1,2,3,4];

　　方法

　　- join(參數(shù))***:將數(shù)組中的元素按照指定的分隔符(傳入的參數(shù))拼接為字符串

　　- push();向數(shù)組的尾部添加一個(gè)或更多個(gè)元素

　　屬性

　　length

　　特點(diǎn)

　　在JS中數(shù)組的元素類(lèi)型是可變的

　　在JS中數(shù)組的長(zhǎng)度是可變的,訪(fǎng)問(wèn)某個(gè)角標(biāo),如果沒(méi)有數(shù)據(jù)則返回undefined;

　　Date:日期對(duì)象

　　創(chuàng)建:

　　var Date = new Date();

　　方法:

　　toLocalString():返回當(dāng)前date對(duì)象對(duì)應(yīng)的時(shí)間本地字符串格式

　　getTime():返回1970年1月1日零點(diǎn)至今的毫秒值

　　Math:數(shù)學(xué)

　　創(chuàng)建: Math對(duì)象不用創(chuàng)建,可以直接使用

　　方法:(知道有哪些功能即可)

　　random():返回0~1之間的隨機(jī)數(shù),左開(kāi)又閉

　　ceil()/floor()/round():向上/向下/四舍五入取整

　　屬性:

　　PI

　　RegExp:正則表達(dá)式對(duì)象

　　正則表達(dá)式:定義字符串匹配規(guī)則

　　組成規(guī)則

　　1).單個(gè)字符:[]

　　如:[a][ab][a-zA-Z0-9];

　　2).特殊符號(hào)代表特殊含義的單個(gè)字符

　　\d:單個(gè)數(shù)字

　　\w:單個(gè)字符

　　3).量詞符號(hào)

　　?: 出現(xiàn)0次或1次 例:\w?字符出現(xiàn)0或1次

　　*: 表示出現(xiàn)0次或多次

　　+: 出現(xiàn)1次或多次

　　{m,n}:表示數(shù)量>=m,<=n

　　創(chuàng)建:(常用第二種方式)

　　- 方式1:var reg = new RegExp("正則表達(dá)式"); 在這里\需要用\\轉(zhuǎn)義

　　- 方式2:var reg = /正則表達(dá)式/; 這里不需要轉(zhuǎn)義

　　方法

　　test(校驗(yàn)對(duì)象):用來(lái)驗(yàn)證指定的字符串是否符合正則定義的規(guī)范

　　常用寫(xiě)法/正則表達(dá)式/.test("字符串");

　　常用的正則表達(dá)式:

　　https://www.cnblogs.com/fozero/p/7868687.html

　　Global:全局對(duì)象

　　特點(diǎn):是一個(gè)全局對(duì)象,其中封裝的方法不需要對(duì)象就可以直接調(diào)用.

　　方法

　　- encodeURI():URL編碼

　　- decodeURI():URL解碼

　　- encodeURIComponent():URL編碼,編碼的字符更多,對(duì)特殊符號(hào)也進(jìn)行編碼

　　- decodeURIComponent():URL解碼,解碼的字符更多,對(duì)特殊符號(hào)也進(jìn)行編碼

　　- parsInt(str):注意判斷每一個(gè)字符是否為數(shù)字,直到不是數(shù)字為止并將前面的數(shù)字轉(zhuǎn)為number

　　- isNaN():判斷一個(gè)變量是否為NaN;

　　注意:NaN參與的比較全部為false,所以不能用==判斷

　　- eval():將JavaScript的字符串轉(zhuǎn)成腳本來(lái)執(zhí)行

　　例:var jscode = "alert(123)";

　　eval(jscode);會(huì)解析片段,并彈出123.

　　- 注:

　　URL編碼:

　　HTTP協(xié)議不支持中文,需要瀏覽器進(jìn)行編碼和解碼

　　將1個(gè)字節(jié)的前4個(gè)bit轉(zhuǎn)換為16進(jìn)制后4個(gè)bit轉(zhuǎn)換成16進(jìn)制,得到一個(gè)二位數(shù),用%隔開(kāi)

　　如在UTF-8下, "傳智播客"= %E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2

作者：黑馬程序員JavaEE培訓(xùn)學(xué)院
首發(fā)：http://java.itheima.com/