《JavaScript高級程序設計》中介紹的幾種JavaScript的引用類型,本文只記了Object跟Function類型
Object類型
創建對象
var person = new Object();
var person = {};
//二者效果是一樣的,但使用對象字面量表示法定義對象時不會調用Object的構造函數
訪問對象屬性
- 點表示法
- 方括號表示法
person.name = '';
person['name'] = '';
// 方括號表示法能用變量來訪問屬性
var propertyName = 'name';
person[propertyName] = '';
//若屬性名包含會導致語法錯誤的字符或關鍵字、保留字,可以使用方括號表示法表示
person['first name'] = '';
Array類型
Date類型
RegExp類型
Function類型
(函數是對象,函數名是指針)
定義函數
- 函數聲明
- 函數表達式
- Function構造函數
//函數聲明
function sum(num1, num2){
return num1 + num2;
}
//函數表達式
var sum = function(num1, num2){
return num1 + num2;
};
//使用Function構造函數,最後一個參數視爲函數體(不推薦)
var sum = new Function('num1', 'num2', 'return num1 + num2');
沒有重載
因爲函數名是一個指針,所以JavaScript的函數沒有重載,後面定義的函數會覆蓋前面的定義
function add(n){
return n + 100;
}
function add(n){
return n + 200;
}
add(100); //300
var add = function(n){
return n + 100;
};
var add = function(n){
return n + 200;
};
add(100); //300
函數聲明與函數表達式(解析順序)
函數聲明會先被解析,而函數表達式要等到執行至定義的那行代碼纔會被解析
//正常執行
alert(sum(10, 10));
function sum(n1, n2){
return n1 + n2;
}
//報錯
alert(sum(10, 10));
var sum = function (n1, n2){
return n1 + n2;
};
作爲值傳遞
function callFunction(f, args){
return f(args);
}
function add(num){
return num + 10;
}
callFunction(add, 10); //20
//在一個函數中返回另一個函數
function callFunction(){
return function(){
};
}
函數內部屬性
函數內部有兩個特殊對象:arguments和this
arguments
arguments.callee屬性指向擁有arguments對象的函數,可用於遞歸調用,消除函數執行與函數名的耦合
//階乘
function factorial(num){
if(num <= 1){
return 1;
} else {
return num * arguments.callee(num - 1); //效果相當於return num * factorial(num - 1);
}
}
var calFactorial = factorial;
factorial = function(){
return 0;
};
calFactorial(5); //120
factorial(5); //0
this
this引用的是函數執行的環境對象(當在全局作用域中調用函數,this對象引用的是window)
window.color = 'red';
var o = {color: 'blue'};
function sayColor(){
alert(this.color);
}
sayColor(); //'red'
o.sayColor = sayColor;
o.sayColor(); //'blue'
caller屬性
函數對象的屬性,保存着調用當前函數的函數的引用,如果是在全局作用域中調用,則值爲null
function outer(){
inner();
}
function inner(){
alert(inner.caller); //或alert(arguments.callee.caller);
}
outer();
/*
彈窗顯示
function outer(){
inner();
}
*/
函數屬性和方法
length, prototype, call(), apply(), bind()
length
length表示函數希望接收命名參數的個數
function fn1(){}
function fn2(a){}
function fn3(a, b){}
alert(fn1.length); //0
alert(fn2.length); //1
alert(fn3.length); //2
prototype
prototype是保存引用類型所有實例方法的地方
prototype不可枚舉,for-in無法遍歷到
call()和apply()
用途:在特定作用域中調用函數(可擴充函數的作用域)
相當於改變函數體內this所指的對象
接收的第一個參數相同,要代替原this的對象
後面的參數是要執行函數的形參,call()逐個接收,apply()可以將參數作爲數組傳入
window.num = 0;
var o = {num: 10};
function add(num1, num2){
alert(num1 + num2 + this.num);
}
add.call(this, 10, 10); //20
add.call(window, 10, 10); //20
add.call(o, 10, 10); //30
add.apply(this, [10, 10]); //20
add.apply(window, [10, 10]); //20
add.apply(o, [10, 10]); //30
bind()
bind()方法會創建一個函數實例,實例的this被綁定爲傳入bind()中的參數(類似於call和apply第一個參數的作用)
window.color = 'red';
var o = {color: 'blue'};
function sayColor(){
alert(this.color);
}
var objSayColor = sayColor.bind(o);
objSayColor(); //'blue'
基本包裝類型
單體內置對象
參考
《JavaScript高級程序設計》(第3版)