Web前端-JavaScript基礎

　　JavaScript基礎概念:客戶端腳本語言

　　基本概念

　　客戶端:這里的客戶端就是瀏覽器

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

　　功能:

　　可以增強用戶和html頁面的交互過程,可以控制html元素,讓頁面有一些動態(tài)效果,提高用戶體驗

　　js的組成結構

　　ECMAScript:基礎語法

　　BOM:瀏覽器對象模型

　　DOM:文檔對象模型

　　4.js的引入方式:

　　-行內式

　　-內聯式

　　定義

　　-注意:

　　一旦引入了一個script,在標簽內不可以再寫任何js代碼,否則內部代碼不生效

　　script標簽可以定義在任意位置

　　script標簽可以定義多個

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

　　ECMAScript

　　基本語法

　　注釋

　　單行注釋://

　　多行注釋:/**/

　　數據類型

　　1).原始數據類型(基本類型)

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

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

　　-boolean:布爾 //true/false

　　-null:一個對象為空的占位符

　　-undefined:未定義 //如果一個對象沒有給初始化值,則被默認賦值為undefined

　　2).引用數據類型(對象)

　　變量

　　1).JavaScript是弱類型語言

　　強類型:在開辟變量存儲空間時,定義了空間將來存儲的數據的數據類型,只能存儲固定類型的數據

　　弱類型:在申請變量內存空間時,不定義空間將來的存儲類型,可以存放任意類型的數據

　　2).語法

　　var 變量名 = 初始化值;

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

　　運算符

　　1).一元運算符: //自增(++)/自減(--)/正號(+)/負號(-)

　　正負號: 會引起數據類型轉換(如果+/-后面跟的不是number類型)

　　2).算數運算符: //和java一樣 加減乘除

　　3).賦值運算符 //和java一樣 =

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

　　類型不同進行比較:先進行類型轉換

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

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

　　!==:只有值和類型全相等時候為false;

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

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

　　!!!注意:在js中如果運算數不是運算符所要求的類型,那么js的引擎會自動將運算數進行類型轉換

　　*string-->number:按照字面量轉化,如果字面量不是數字,則轉為NaN;

　　*boolean-->number:true轉為1,false轉為0;

　　*null/undefined-->number:NaN

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

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

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

　　*對象-->boolean:所有對象都為真

　　if(obj) 對象不為空,字符串長度>0

　　流程控制語句

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

　　2).switch

　　在java中,switch語句可以接受的數據類型:byte short int char,枚舉(1.5) String(1.7)

　　在js中,switch語句可以接受任意類型的數據

　　3).while

　　4).do...while

　　5).for

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

　　1).語句以分號結尾,如果一行只有一條語句,則;可以省略

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

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

　　-不使用var定義的變量時全局變量

　　注:什么是變量???

　　一小塊存儲數據的內存空間

　　基本對象

　　Function:函數對象

　　Funciton對象的創(chuàng)建

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

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

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

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

　　2).屬性

　　-length:代表形參的個數

　　3).特點****

　　-在創(chuàng)建函數對象時,參數類型不用寫,返回值類型

　　-函數是一個對象,如果定義名稱相同的函數則會覆蓋之前定義的函數

　　-在JS中函數的調用只與方法名稱有關,與參數列表無關

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

　　調用時可以使用 fun();/fun(1);/fun(1,2);/fun(1,2,3)/fun(1,2,3,4)

　　-在JS中存在內置參數arguments,它是一個數組

　　例:求任意個數的和

　　function add(){

　　var sum=0;

　　for(vari=0;i

　　return sum;

　　}

　　Function對象的調用

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

　　var s = 函數名; 將函數對象賦給s;

　　Array:數組對象

　　數組對象的創(chuàng)建

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

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

　　- var arr = new Array(默認長度)

　　var arr = new Array(5);

　　- var arr = [元素列表]

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

　　方法

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

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

　　屬性

　　length

　　特點

　　在JS中數組的元素類型是可變的

　　在JS中數組的長度是可變的,訪問某個角標,如果沒有數據則返回undefined;

　　Date:日期對象

　　創(chuàng)建:

　　var Date = new Date();

　　方法:

　　toLocalString():返回當前date對象對應的時間本地字符串格式

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

　　Math:數學

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

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

　　random():返回0~1之間的隨機數,左開又閉

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

　　屬性:

　　PI

　　RegExp:正則表達式對象

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

　　組成規(guī)則

　　1).單個字符:[]

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

　　2).特殊符號代表特殊含義的單個字符

　　\d:單個數字

　　\w:單個字符

　　3).量詞符號

　　?: 出現0次或1次 例:\w?字符出現0或1次

　　*: 表示出現0次或多次

　　+: 出現1次或多次

　　{m,n}:表示數量>=m,<=n

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

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

　　- 方式2:var reg = /正則表達式/; 這里不需要轉義

　　方法

　　test(校驗對象):用來驗證指定的字符串是否符合正則定義的規(guī)范

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

　　常用的正則表達式:

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

　　Global:全局對象

　　特點:是一個全局對象,其中封裝的方法不需要對象就可以直接調用.

　　方法

　　- encodeURI():URL編碼

　　- decodeURI():URL解碼

　　- encodeURIComponent():URL編碼,編碼的字符更多,對特殊符號也進行編碼

　　- decodeURIComponent():URL解碼,解碼的字符更多,對特殊符號也進行編碼

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

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

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

　　- eval():將JavaScript的字符串轉成腳本來執(zhí)行

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

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

　　- 注:

　　URL編碼:

　　HTTP協議不支持中文,需要瀏覽器進行編碼和解碼

　　將1個字節(jié)的前4個bit轉換為16進制后4個bit轉換成16進制,得到一個二位數,用%隔開

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

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