1. 複雜數據類型 Object ECMAScript中的對象其實就是一組數據(屬性)和功能(方法)的集合。 1) 創建Object實例: 1.使用構造函數創建,new Object() var person = new Object(); person.name = "briup"; person ...
1. 複雜數據類型 Object
ECMAScript中的對象其實就是一組數據(屬性)和功能(方法)的集合。
1) 創建Object實例:
1.使用構造函數創建,new Object()
var person = new Object();
person.name = "briup";
person.age = 22;
2.使用對象字面量表示法
不同的屬性之間用','分割,屬性名和屬性值之間用':'分割
var person = {
name : "briup",
age : 22
};
2) 訪問對象屬性
1.點表示法,右側必須是以屬性名稱命名的簡單標識符
person.name
2.中括弧表示法,中括弧中必須是一個計算結果為字元串的表達式,可以通過變數訪問屬性,如果屬性名中包含語法錯誤的字元,或者屬性名使用的是關鍵字或保留字,可以使用中括弧 person["first name"]
var a = "name";
person[a]; //既person["name"]
person["first name"]
3) 刪除屬性
delete只是斷開了屬性和宿主對象的聯繫,而不會操作屬性中的屬性,並且delete只會刪除自有屬性,不能刪除繼承屬性。在銷毀對象時,為了防止記憶體泄露,遍歷對象中的屬性,依次刪除所有屬性。
語法:delete 屬性訪問表達式
例如:
delete stu.name //刪除學生對象中的name屬性
4) 檢測屬性
in 檢測某屬性是否是某對象的自有屬性或者是繼承屬性,是就返回true,否則返回false
"toString" in student
hasOwnProperty()檢測給定的屬性是否是對象的自有屬性,對於繼承屬性將返回false
var o = {
x:1
}
o.hasOwnProperty("x"); //true, x 為o的自有屬性
o.hasOwnProperty("y"); //false,o 中不存在屬性y
o.hasOwnProperty("toString"); //false,toString為繼承屬性
propertyIsEnumerable() 檢測給定的屬性是否是該對象的自有屬性,並且該屬性是可枚舉的通常由JS代碼創建的屬性都是可枚舉的,但是可以使用特殊的方法改變可枚舉性。
student.propertyIsEnumerable("toString") //false 不可枚舉
5) Object屬性及方法
Object 類型所具有的任何屬性和方法也同樣存在於其他對象中,任何對象繼承於Object對象
Object中常用的方法:
hasOwnProperty(propertyName);
檢查給定的屬性名是否是對象的自有屬性,
toString();
返回對象的字元串表示
valueOf();
返回對象的字元串,數值,布爾值的表示。
propertyIsEnumerable(propertyName);
檢查給定的屬性在當前對象實例中是否存在
constructor:
保存用戶創建當前對象的函數
isPrototypeOf(object);
檢查傳入的對象是否是原型
toLocaleString();
返回對象的字元串表示,該字元串與執行環境的地區對應
6) 對象序列化
對象序列化是指將對象的狀態轉換為字元串,也可以反序列化,將字元串還原為對象函數,RegExp,Error對象,undefined值不能序列化和反序列化。
JSON.stringify(obj)
將對象序列化為Json字元串,只能序列化對象可枚舉的自有屬性。
JSON.parse(jsonStr)
反序列化
2. 函數
0)聲明提升:
函數聲明提升,所有的函數聲明會提升至當前的作用域頂部
//函數聲明--->函數聲明會提升
function fnName(arg1,arg2){
//function body
}
//函數表達式--->函數表達式並不會被提升
var fnName=function(){
//function body
};
變數聲明提升
alert("a" in window);
var a; ===>var a;
alert(""a" in window);
只有變數聲明被提升而變數初始化不會提升(即變數直接賦值時在執行階段創建)。
var a=1; ===>var a;
a=1;
alert(a); //undefined
alert(b);//error
b=10;
var a=20;
當變數聲明並初始化,javascript會自動拆分變數聲明和變數初始化
為什麼沒有提升變數初始化?
因為這樣會影響變數值在代碼執行期間導致不可預料的結果
必須知道和理解函數聲明會覆蓋變數聲明,但不會覆蓋變數初始化
function value(){
return 1;
}
var value;
alert(typeOf value); //function (typeOf返回一個表示類型的字元串)
//即使變數聲明出現在函數聲明之後,函數聲明也會獲得更高的優先權
function value(){
return 1;
}
var value=1;
alert(typeOf value); //Number 變數初始化覆蓋了函數聲明
var a=1; var a;
function foo(){ function foo(){
a=10; function a(){}
function a(){} ===> a=10;
} }
foo(); a=1;
alert(a); foo();
alert(a); //1
1) 作為值的函數
由於函數名本身就是變數,所以函數可以當做值來使用(參數,返回值)。
function callOther(fun,args){
return fun(args);
}
function show(msg){
alert(msg);
}
callOther(show,"哈哈"); //show為參數
2) 作為返回值的函數
eg:多功能自定義排序函數
function myCompare(pro){
//函數將作為返回值返回
return function(obj1,obj2){
var val1 = obj1[pro];
var val2 = obj2[pro];
if(val1<val2){
return -1;
}else if(val1>val2){
return 1;
}else {
return 0;
}
}
}
var data = [
{
name : "aaa",
age :12
},{
name:"ccc",
age : 8
},{
name :"bbb",
age : 71
}
];
console.log(data);
data.sort(myCompare("age"));
console.log(data);
3) 函數內部屬性
1. arguments :是類數組對象,包含著傳入函數中參數,arguments對象還有一個callee的屬性,用來指向擁有這個arguments對象的函數
//實現多個數值類型的相加
var addAll = function(){
console.log(arguments.callee == addAll);
// arguments = [1,2,3,5];
var total = 0;
for(var key in arguments){
//通過索引獲取值,key索引 0,1,2,3
var value = arguments[key];
total +=value;
}
return total;
}
var result = addAll(1,2,3,5,3,4);
console.log("結果為:"+result);
例如:
num的階乘,使用遞歸函數
function factorial(num){
if(num<=1){
return 1;
}else{
//return num * factorial(num-1);
return num * arguments.callee(num-1);
}
}
2. this: 指向的是函數賴以執行的環境對象
window.color = "window";
var person = {
color:"person"
};
function sayColor(){
alert(this.color);
}
sayColor(); //window對象調用,所以彈出 "window"
person.sayColor = sayColor; //將該方法賦給person對象
person.sayColor();//使用person對象調用該方法,彈出"person"
4) 函數的屬性
length: 表示函數希望接受的命名參數的個數
function say(msg){} //say.length 1 希望接受一個參數
function add(m,n){} //add.length 2 希望接受兩個參數
prototype: 保存實例方法的真正所在。在自定義引用數據類型以及繼承時非常重要。
5) 函數的方法
this->該函數所在的環境對象
<script>
var person = {
name:"terry",
add:function(){
}
}
person.add();
function add(a,b){
alert(a+b);
}
add(1,2);// this->window
=>
add.call(window,1,2);
</script>
apply : 參數(在其中運行函數的作用域,參數數組(Array,arguments));
call : 參數(在其中運行函數的作用域,參數列表)
這兩個方法作用都是在特定的作用域中調用函數,實際上等於設置函數內部的this的值
用法一:
function sum(m,n){
return m+n;
}
function call(m,n){
//return sum.apply(this,arguments);
return sum.call(this,m,n);
}
alert(call(1,2));
用法二:
擴充函數賴以運行的作用域
window.color = "window";
var person = {
color:"person"
};
function sayColor(){
alert(this.color);
}
sayColor.call(this);
sayColor.call(window);
sayColor.call(person);
3. 基本數據類型,引用數據類型
基本數據類型的變數:
可以直接操作保存在變數中的實際的值
參數傳遞的時候傳遞的是實際值
引用數據類型的變數:
不能直接操作對象的記憶體空間,實際上是在操作對象的引用。
可以為引用類型變數天極愛屬性和方法,也可以改變和刪除其屬性和方法
參數傳遞的時候傳遞的是引用地址。
值傳遞
值的拷貝
引用傳遞
引用地址的拷貝
var a = 3;
var p1 = {
name:"larry",
age:14,
gender:"男",
};
function changeA(a){
++a;//4
}
function changeName(p){
//b001
p.name ="tom"
}
function changeP(p){
//p = b001
//p = b002
p = {
name:"jacky",
age:14,
gender:"男",
}
}
console.log(p1);// b001 Object {name: "larry", age: 14, gender: "男"}
changeName(p1); //b001
//changeP(p1);
console.log(p1);//b001 Object {name: "tom", age: 14, gender: "男"}
console.log("before a:"+a); //3
changeA(a);
console.log("after a:"+a); //3