[JS] javascript基礎語法
1.javascript是什麽
js是具有面向對象能力的,解釋性的程序設計語言.
2.js的類型
[基本類型]:string number boolean
[復合類型]:對象(對象,函數,數組)
[無類型]:null undefiend
3.typeof
語法:string typeof (變量名) 或者 string typeof 變量名
作用:返回這個變量的類型
4.塊級作用域
js沒有塊級作用域的概念.if while等內聲明的變量都是和外面聲明的變量是同一作用域的.
5.運算符
==和!=:是判斷2個結果是否相等
in:屬性是否屬於某個對象
instanceof:變量是否屬於某個類 add instanceof Function
6.數字類型
js中的數字類型都是浮點數.1===1.00
8進制:0開頭 16進制:0x開頭
7.NaN Infinity IsNaN IsFinite
NaN:Not a Number alert(0/0)
Infinity:無限的 alert(0.1/0)
boolean IsNaN(number): 判斷不是數字
boolean IsFinite(number): 判斷數字是不是有限的
8.string類型方法
string substring(startindex,endindex):左邊取的到,右邊取不到
string substr(startindex,length):
9.包裝類型
包裝類型和基本類型的用法一直,是對基本類型的擴充.
Number String Boolean
10.函數/匿名函數
函數是js的靈魂,匿名函數就是將函數賦給一個變量.
函數:function 函數名(參數){方法體}
匿名函數:var 變量名 = function(參數){方法體}
11.變量名提升/函數名提升
函數中是局部作用域,在局部作用域內使用var聲明的變量都會隱式的前置.
如:
var i = 1;
function test(){
alert(i);
var i = 2; //此處聲明的i相當於在局部作用域最上面聲明的.所以alert(i)的i為undefined.
alert(i);
}
var func = function(){return 1};
function test(){
func();
var func = function(){return 2}; //此處和上例相同,因為是函數調用的原因.此處會直接報錯.執行不下去.
func();
}
12.動態函數
new Function(arg1,arg2...argN,body):會創建一個函數並返回.
13.arguments
函數的內部會有一個默認的arguments對象,不是數組.
typeof arguments = Object. arguments instanceof Array = false
14.創建對象
在js中沒有類的概念,但是函數可以作為構造函數來使用.對象實際就是鍵值對.
var Person = function(){
this.ID = 1;
this.Name = ‘2‘;
}
var p1 = new Person(); //創建了一個Person對象,有屬性ID和Name
原理:
new 關鍵字:創建一個object對象.將函數內的this指向這個對象.
構造函數:執行構造函數為this擴展成員.執行完返回this對象.
15.對象的字面值
var o = {
Id:1
,Name:‘2‘
}
可以隨意的添加成員o.Age = 3;刪除成員:delete o.Age;調用成員o[‘Age‘]();
16.數組的創建
2種方式創建:
var arr = new Array()
var arr = []
一般給數組賦值都是:
arr[arr.length] = value;
17.null undefined
null表示空,沒有引用對象.
undefined表示未定義,不存在.有3種情況:
a.未定義的屬性
b.未定義的變量
c.返回只有return
18.Error
相當於C#中的Exception對象
在js中 throw new Error(‘此處有錯誤‘);
常用:throw {msg:‘異常‘,date:new Date()}
19.常用函數
編碼函數:
encodeURI:對字符串編碼,讓中文可以再網絡中正常傳輸 推薦使用
decodeURI:對字符串解碼. 推薦使用
escape:編碼 unescape:解碼 編碼成16進制.
20.擴展方法
擴展方法的本質就是繼承.
構造函數都有prototype(原型)屬性.通過構造函數new的對象實際都是派生自prototype.
註意:所有的函數都繼承自Function.間接繼承Object.
Function.prototype.say = function(){ //給所有函數擴展了一個say方法.
alert(‘每個函數都能調用‘); //函數都派生自Function的prototype屬性
}
var func = function(){}; func.say();
21.繼承 重點
(var obj = new Object(); var str = new String(); var func = new Function(); 所以Object,String,Function都為構造函數.)
//繼承方式1:
Object.prototype.jc = function(objBase){
var F = function(){};
F.prototype = objBase;
return new F();
}
//繼承方式2:
Object.prototype.jc = function(objBase){
this.prototype = objBase;
}
var F = function(){};
F.jc(objBase);
var func = new F();
//繼承方式3:(多繼承)
Object.prototype.jc = function () {
var arr = arguments;
for (var i = 0; i < arr.length; i++) {
for (var k in arr[i]) {
this.prototype[k] = arr[i][k];
}
}
};
var F = function(){};
F.jc({id:1},{age:2},{say:function(){
alert(this.id + ":"+ this.age);
}})
var fu = new F();
fu.say();
22.閉包
閉包就是 將高級作用域內的變量提供給低級作用域訪問.
var P = function () {
var i = 1;
return function(){
alert(i);
}
};
var p = new P(); p(); 最外面的p能調用P函數裏面的i;
23.函數
函數在js中有4種身份
[函數]:var func = function(){}; //函數與方法的區別主要在函數內this指的是什麽.
[方法]:var o = {}; o.say = function(){};
[構造函數]:var P = function(){}; var o = new P();
[apply|call]:函數名.apply(對象,[參數數組]) 函數名.call(對象,參數列表);
24.DOM
DOM操作就是js操作html標簽.
DOM操作:
創建節點:Element document.createElement(tagName)
獲得節點:
根據id,className,tagName Element document.getElementByXX(XXValue)
獲得子節點:
父節點.childNodes
父節點.firstChild
父節點.lastChild
獲得兄弟節點:
當前節點.nextSibling
添加節點:
父節點.appendChild()
刪除節點
父節點.removeChild()
設置節點屬性
DOM.setAttribute(‘屬性名‘,‘屬性值‘)
DOM.getAttribute(‘屬性名‘)
常用屬性:nodeName(大寫標簽名),nodeType(1標簽 2屬性 3文本),nodeValue(文本節點的文本)
設置節點文本
元素節點.innerText
文本節點.nodeValue
input節點.value
DOM樹:註意的是文本節點是一個單獨的節點.
25.setTimeout,setInterval本質還是單線程的.js是以事件方式驅動的
26.js壓縮:
方式一:
javascript compressor 在線壓縮工具
地址:http://dean.edwards.name/packer/
方式二:
JSA 壓縮,混淆,分析的工具
下載地址:
方式三:
closure compiler 谷歌的js優化器.非常智能.
下載地址:
[JS] javascript基礎語法