JavaScript是一門程式設計語言,浏覽器内置了JavaScript語言的解釋器,是以在浏覽器上按照JavaScript語言的規則編寫相應的代碼,浏覽器可以解釋并作出相應的處理。
1·JavaScript代碼存在形式
1 <!--方式一-->
2 <script type"text/javascript" src="js檔案"></script>
3
4
5 <!--方式二 -->
6 <script type"text/javascript">
7 js代碼内容...
8 </script>
2·JavaScript代碼存在位置
·HTML的head中
·HTML的body代碼塊底部(強烈推薦)
由于html代碼是從上到下執行,如果Head中的js代碼耗時嚴重,就會導緻使用者長時間無法看到頁面,如果放置在body代碼塊底部,那麼及時js代碼耗時嚴重,也不會影響使用者看到頁面的效果,隻是js實作特效慢而已。
1 如:
2 <script src="https://www.xxxx.com"></script>
3 <script>
4 alert("123");
5 </script>
6
7
8 //alert(彈窗)
3·變量
·全局變量
·局部變量
JavaScript中變量的聲明是一個非常容易出錯的點,局部變量必須以個var開頭,如果未使用var,則默人表示聲明的是全局變量·
1 var name ="xxxx" //局部變量
2 age = 18 //全局變量
注:單行注釋 // 多行注釋 /* */
4·基本資料類型
javascript 中的資料類型分為原始類型和對象類型:
·原始類型
·數字
·字元串
·布爾值
·對象類型
·數組
·"字典"
·...
特憋的,數字,布爾值,null,undefined,字元串是不可變的.

null和undefined
//null, undefined
null,是JavaScript語言的關鍵字,它表示以個特殊的值,常用來描述"空值".
undefined是一個特殊值,表示變量未定義.
1·數字(Number)
JavaScript中不區分整數值和浮點數值,java中所有數字均使用浮點數值表示·
轉換:
·parseIne(變量名) 将某個值轉換成數字,不成功則返現NaN
·parseFloat(變量名)将某個值轉換成浮點數,不成功則返現NaN
特殊值:
·NaN:非數字,可使用isNaN(num)來判斷·
·Infinity:無窮大,可使用isFinite(num)來判斷·
更多數值計算:

常量
Math.E
常量e,自然對數的底數·
Math.LN10
10的自然對數·
Math.LN2
2的自然對數·
Math.LOG10E
以10為底的e的對數·
Math.LOG2E
以2為底的e的對數·
Math.PI
常量figs/U03C0.gif·
Math.SQRT1_2
2的平方根除以1·
Math.SQRT2
2的平方根·
##靜态函數
Math.abs()
計算絕對值·
Math.acos()
計算反餘弦值·
Math.asin( )
計算反正弦值。
Math.atan( )
計算反正切值。
Math.atan2( )
計算從X軸到一個點的角度。
Math.ceil( )
對一個數上舍入。
Math.cos( )
計算餘弦值。
Math.exp( )
計算e的指數。
Math.floor( )
對一個數下舍人。
Math.log( )
計算自然對數。
Math.max( )
傳回兩個數中較大的一個。
Math.min( )
傳回兩個數中較小的一個。
Math.pow( )
計算xy。
Math.random( )
計算一個随機數。
Math.round( )
舍入為最接近的整數。
Math.sin( )
計算正弦值。
Math.sqrt( )
計算平方根。
Math.tan( )
計算正切值。
math
2·字元串(String)
字元串是由字元組成的數組,但在JavaScript中字元串是不可變的:可以通路字元串任意位置的文本,但是JavaScript并未提供修改已知字元串内容的方法·
常見功能:
a = "huanyingguanglin"
"huanyingguanglin"
a.length (檢視長度)
16
a = " wyc "
" wyc "
a.trim() (去除字元串的兩邊空格)
"wyc"
a.trimleft() (去除字元串的左邊空格)
a.trimright (去除字元串的右邊空格)
a = "nihao"
"nihao"
a.charAt(2) (傳回字元串中的參數的字元)!參數可以定義,看字元串的長度定義
"h"
a = "wyc"
"wyc"
b = "nihao"
"nihao"
a.concat(b) (字元串的拼接)
"wycnihao"
a = "wycnihao"
a.indexOf("ni",2) (尋找子序列位置)
3
a.lastIndexOf("yc",2) (子序列位置 )
1
a.substring("yc",4) (根據索引擷取子序列)
"wycn"
a.slice(1,6) (切片,從字元串的1位置到6位置)
"ycnih"
a.toLowerCase() (将字元串變小寫)
a.toUpperCase() (将字元串變大寫)
"WYCNIHAO"
a.split("cn") (字元串的分割)
["wy", "ihao"]
a = "wycwyc9wycwyc"
"wycwyc9wycwyc"
a.split(/(\d+)/) (字元串的分割,支援正則分割)
["wycwyc", "9", "wycwyc"]
a = "wycwycwyc"
"wycwycwyc"
a.match(/w/) (全局比對)
["w"]
a.match(/w/g) (比對的元素後邊加個g,表示把字元串裡邊所有的w全部比對出來)
["w", "w", "w"]
a.search(/y/) (比對出元素的位置)
a = "wyc7wycwyc9"
"wyc7wycwyc9"
a.replace(/(\d+)/g,"X") (将比對到的數字全部替換為"X")
"wycXwycwycX"
a.replace(/(\d+)/g,"$&"+"L") (将比對到的數字後邊的元素替換為“L”)
"wyc7Lwycwyc9L"
a.replace(/(\d+)/g,"&") (将所有比對到的數字替換成艾特符号“&”)
"wyc&wycwyc&"
a.replace(/(\d+)\w+(\d+)/g,"$2$1") (将比對到數字的7,9交換一下位置)
"wyc97"
a.replace(/\d+/,"$`") (用于比對左側文本)
"wycwycwycwyc9"
a.replace(/(\d+)\w+(\d+)/g,"$$") (直接量"$"符号)
"wyc$"
3·布爾值
布爾類型僅包含真假,與python不同的是,python第一個字母是大寫,("True","False"),則JavaScript裡是小寫("true","false")
· == (比較值相等)
· != (不等于)
· === (比較值和類型相等)
· !=== (不等于)
· || (或)
· && (且)
4·數組
JavaScript中的數組類似于python中的清單[]
1 obj.length //數組的大小
2
3 obj.push(ele) //尾部追加元素
4
5 obj.pop //尾部擷取元素
6
7 obj.shift() //頭部移除元素
8
9 obj.splice(start,deleteCount,value,......) //插入·删除或替換數組的元素
10
11 obj.splice(n,0,val) //指定位置插入元素
12 obj.splice(n,1,val) //指定位置替換元素
13 obj.splice(n,1) //指定位置删除元素
14
15 obj.slice() //切片
16
17 obj.reverse() //反轉
18
19 onj.join(sep) //将數組元素連結起來以建構一個字元串
20
21 obj.concat(val,...) //連接配接數組
22
23 obj.sort() //對數組元素進行排序
//檢視數組元素的長度
a = [11,22,33,44,55]
[11, 22, 33, 44, 55]
a.length
5
// 給數組尾部添加元素
a.push(66)
6
a
[11, 22, 33, 44, 55, 66]
//删除數組元素
[11, 22, 33, 44, 55, 66]
ret = a.pop()
66
ret
66
a
[11, 22, 33, 44, 55]
//在數組頭部添加元素
[11, 22, 33, 44, 55]
a.unshift(77)
6
a
[77, 11, 22, 33, 44, 55]
//在數組頭部移除元素
[77, 11, 22, 33, 44, 55]
a.shift()
77
a
[11, 22, 33, 44, 55]
//splice即删除既添加
a
[11, 22, 33, 44, 55]
a.splice(1,0,"wyc") (表示在1的位置,0表示不删除,"wyc"表示在1的
位置添加進去)
[]
a
[11, "wyc", 22, 33, 44, 55]
//splice能添加多個元素
[11, "wyc", 22, 33, 44, 55]
a.splice(1,0,"wyc","nihao") (splice,可以在數組一次裡邊添加多個元素 )
[]
a
[11, "wyc", "nihao", "wyc", 22, 33, 44, 55]
//splice删除
[11, "wyc", "nihao", "wyc", 22, 33, 44, 55]
a.splice(1,2) (表示從數組的第一個位置删除兩個元素)
["wyc", "nihao"]
a
[11, "wyc", 22, 33, 44, 55]
//splice替換
[11, "nihao", "wyc", 22, 33, 44, 55]
a.splice(1,1,"hi") (表示在元素1的位置删除1在添加一個新的元素)
["nihao"]
a
[11, "hi", "wyc", 22, 33, 44, 55]
//切片
a
[11, "hi", "wyc", 22, 33, 44, 55]
a.slice(1,2)
["hi"]
//反轉
[11, "hi", "wyc", 22, 33, 44, 55]
a.reverse() (将數組元素反轉過來)
[55, 44, 33, 22, "wyc", "hi", 11]
//将數組元素拼接起來(join)
[55, 44, 33, 22, "wyc", "hi", 11]
a.join("_") //将數組元素用下滑線拼接起來
"55_44_33_22_wyc_hi_11"
//sort排序
[55, 44, 33, 22, "wyc", "hi", 11]
a.sort() //将數組進行排序
[11, 22, 33, 44, 55, "hi", "wyc"]
四·其他
1丶序列化
·JSON.stringify(obj) 序列化
·JSON.parse(str) 反序列化

a = 3
3
JSON.stringify(a) (将a序列化成字元串)
"3"
JSON.parse(a) (将a在反序列化成整數)
3
序列化,反序列化
2丶轉義
·decodeURI() URI中為轉義的字元
·decodeURIComponent() URI元件中的未轉義字元
·encodeURI() URI中的轉義字元
·encodeURIComponent() 轉義URI元件中的字元
·escape() 對字元串的轉義
·unescape() 給轉義字元串解碼
·URIError 由URI的編碼和解碼方法抛出
3丶eval
JavaScript中的eval是python中eval和exec的合集,既可以編譯代碼也可以擷取傳回值·
·eval()
·EvalError 執行字元串中的JavaScript代碼
4丶正規表達式
JavaScript中支援正規表達式,其主要提供了兩個功能:
·test(string) 用于檢測正則是否比對
·exec(string) 用于擷取正則比對的内容
注:定義正規表達式時,"g","i","m"分别表示去全局比對,忽略大小寫,多行比對·
5丶時間處理
JavaScript中提供了時間相關的操作,時間操作中分為兩種時間:
·時間統一時間
·本地時間(東8區)
更多操作參見:http://www.shouce.ren/api/javascript/main.html
五丶語句和異常
1丶條件語句
javascript中支援兩個條件語句分别是:if和switch
if(條件){
}else if(條件){
}else{
}
switch(name){
case"1":
age = 123;
break;
case"2":
age = 456;
break
default:
age = 777;
}
2丶循環語句
javascript中支援三種循環語句,分别是:

var names = ["wyc","nihao"];
for(var i=0;i>names.lengith;i++){
console.log(i);
console.log(name[i]);
}
方式一

var name = ["wyc","nihao"]
for (var index in name ){
console.log(index);
console.log(name[index]);
}
方式二

while(條件){
//break;
//continue;
}
View Code
3丶異常處理

1 try{
2 //這段代碼從上到下運作,其中任何一個語句抛出異常該代碼塊就結束運作·
3 }
4 catch(e){
5 //如果try代碼中抛出異常,catch代碼塊中的代碼就會被執行.
6 //e是一個局部變量,用來指向Error對象或者其他抛出的對象
7 }
8 finally{
9 //無論try中代碼是否有異常抛出(甚至是try代碼塊中有return語句),finally代碼塊中始終會被執行·
10 }
注:主動跑出異常throw Error("xxxxx")
六丶函數
1·基本函數
javascript中函數基本可分為一下三類:

//普通函數
function function(arg){ //建立函數
return true;
}
//匿名函數
var func = function(arg){
return "tony";
}
//自動執行函數
(function(arg){
console.log(arg);
})("123")
注意:對于javascript中函數參數,十幾參數的個數可能小于形參的個數,函數内的特殊值arguments中封裝了所有的實際參數·
2·作用域
javascript中每個函數都有自己的的作用域,當出現函數嵌套時,就出現了作用域鍊,當内層函數使用變量時,會根據作用域鍊從内到外一層層的循環,如果不存在則異常·
!切記:所有的作用域在建立函數且未執行的時候就已經存在了·
1 function f2(){
2 var arg = 111;
3 function f3(){
4 conlose.log(arg);
5 }
6 return f3();
7 }
8
9 ret = f2(); //執行函數
10 ret();

function f2(){
var arg = [11,22];
function f3(){
console.log(arg);
}
arg = [44,55];
return f3;
}
ret = f2();
ret();
注:聲明提前,在javascript引擎"預編譯"時進行·
更多:
3丶閉包
[閉包],是指擁有多個變量和綁定了這些變量的環境的表達式(通常是一個函數),因而這些變量也是該表達式的一部分·
閉包是個函數,而他[記住了周圍發生了什麼]·表現為由[一個函數]體中定義了[另一個函數],由于作用域鍊隻能從内向外找,預設外部無法擷取函數内部變量.閉包、在外部擷取函數内部的變量.
function f1(){
var arg = [11,22];
function f2(){
return arg;
}
return f2;
}
ret = f2();
ret();
面向對象·
function Foo (name,age){
this.Name = name;
this.Age = age;
this.Func = function(arg){
return this.name + arg;
}
}
var obj = new Foo("Wyc",19);
var ret = obj.Func("nihao");
console.log(ret);
對于上述代碼需要注意:
· Foo充當的構造方法 在python構造方法代指的是(__init__)
· thif 代指對象
· 建立對象是需要使用 new
上述代碼中每個對象中均儲存了一個相同的Func函數,進而浪費記憶體.使用原型和可以解決該問題.
function Foo(name,age){
this.Name = name;
this.Age = age;
}
Foo.prototype = {
GetInfo:function(){
return this.Name + this.Age
},
Func : function(arg){
return this.Name + arg;
}
}