《javascript高级程序设计二》学习笔记5引用类型 _JavaScript

《javascript高级程序设计2》学习笔记5引用类型

引用类型

? ? 引用类型的值是引用类型的一个实例。引用类型是一种数据结构。用于将数据和功能组织在一起。

5.1 Object类型

功能：在应用程序中存储和传输数据

创建Object的2种方式：

new操作符后跟Object构造函数。

var person = new Object();
person.name = "flyer";
person.age = 26;

? ?2. ? 使用对象字面量表示法

/*
* 在对象字面量中使用逗号来分隔不同的属性，最后一个属性后不能加逗号，会在ie和opera中报错
*属性名也可以使用字符串
*/
var person ={
       name : "flyer",
       age : 26
};

?对象字面量语法更优，要求的代码量少，给人封装数据的感觉！对象字面量也是向函数传递大量可选参数的首选方式

function displayInfo(args) {
            var output = "";
        
            if (typeof args.name == "string"){
                output += "Name: " + args.name + "\n";
            }
        
            if (typeof args.age == "number") {
                output += "Age: " + args.age + "\n";
            }
        
            alert(output);
        }
        
        displayInfo({ 
            name: "Nicholas", 
            age: 29
        });
        
        displayInfo({
            name: "Greg"
        });

5.2 Array类型

ECMAScript数组的每一项可以保存任何类型的数据。

创建数组的2种方式：

? ?1. 使用Array构造函数

var colors = new Array();
/*也可给构造函数传递数量*/
var colors = new Array(10);
/*也可给构造函数传递数量应该包含的项*/
var colors = new Array("red","blue","green");

? ? 2. 使用数字字面量表示法

/*数字字面量由一对包含数组项的方括号表示，多个之间用逗号分隔。*/

var colors = ["red","blue","green"];
/*数组的length属性不是只读的。设置这个属性，可以从数组末尾移除项或向数组中添加新项*/

colors.length = 2;
alert(colors[2]); //undefined

5.2.1转换方法

?toString(),toLocaleString(),valueOf()方法。

其中调用数组的方法toString()和valueOf()方法会返回相同的值。

var colors = ["red","blue","green"];
alert(colors.toString());
alert(colors.valueOf());
alert(colors);  //后台调用toString()方法

?toLocaleString()除了会返回上面两个方法外，也会创建一个数组值的以逗号分隔的字符串。区别是：调用的每一项是toLocaleString()方法，而不是toString()。

?join()方法可以使用不同的分隔符来构建字符串，join 方法重现了toString()的输出。

var colors = ["red", "green", "blue"];
alert(colors.join("||"));     //red||green||blue

5.2.2栈方法

数组可以像栈一样，栈是一种LIFO(last-in-first-out后进先出)的数据结构,最新添加的项最早被移除。可以限制插入和删除项的数据结构。

数组的插入或移除只发现在栈的顶部。

a)???????? push() 添加到数组的末尾

b)???????? pop() 从数组末尾移除最后一项，然后返回移除的项

5.2.3队列方法

队列是一种FIFO(first-in-first-out先进先出)的数据结构。

? shift() 移除数组中的第一个项并返回该项

? unshift() 能在数组前端添加任意个项并返回新数组的长度

5.2.4重排序方法

? ?reverse() 反转数组项的顺序(不够灵活)

? ?sort() 默认按升序排列数组项-即最小的值在最前面，会调用toString()转型方法。也可以接受一个比较函数做为参数

var values = [0,1,5,16,4];
       values.sort();
       alert(values);  //0,1,16,4,5

5.2.5操作方法

? ? 1） concat()方法可以基于当前数组中的所有项创建一个新数组。（创建当前数组副本，将接受到的参数添加到副本的未尾，返回新构建的数组。）如果传递的是一或多个数组，则该方法会将这些数组中的每一项都添加到结果数组中。如果传递的值不是数组，这些值添加到结果的末尾。

? ? 2）slice()

? ? ? ? ??二个参数slice(a,b)指返回项的起始和结束的位置之间的项（不包括结束位置的项）。

? ? ? ? ? 一个参数slice(a)返回从该参数指定位置开始到当前数组末尾的所有项。

? ?3）splice()方法用于删除、插入或替换数组的元素。?

? ? 语法? ?arrayObject.splice(index,howmany,element1,.....,elementX)?
参数描述?
index?必需。规定从何处添加/删除元素。 ?开始插入和（或）删除的数组元素的下标，必须是数字。?
howmany?必需。规定应该删除多少元素。必须是数字，可以是 0。?如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。?
element1 可选。规定要添加到数组的新元素。从 index 所指的下标处开始插入。?
elementX 可选。可向数组添加若干元素。?
返回值?

如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。?
说明?
splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。?
注释?
注意：splice() 方法与 slice() 方法的作用是不同的，splice() 方法会直接对数组进行修改。

var colors = ["red", "green", "blue"];
        var removed = colors.splice(0,1);              //删除第一项
        alert(colors);     //green,blue
        alert(removed);    //red - 返回的数组中只包含一项
        
        removed = colors.splice(1, 0, "yellow", "orange");  //从位置一开始插入两项
        alert(colors);     //green,yellow,orange,blue
        alert(removed);    //返回一个空数组
        removed = colors.splice(1, 1, "red", "purple");    //插入两项，删除一项
        alert(colors);     //green,red,purple,orange,blue
        alert(removed);    //yellow - 返回的数组中只包含一项

?感谢作者，让我了解更透彻：http://hi.baidu.com/jinwb/item/e240190bac0d28036d90487c

5.3 Date类型

Date.parse()接收一个表示日期的字符串参数，尝试根据这个字符串返回相应日期的毫秒数。

Date.UTC()方法也是返回表示日期的毫秒数，但与Date.parse()在构建值时使用不同的信息。

5.3.1继承的方法

? ?重写了toLocaleString()，toString(),(在调试代码时用)valueOf()(比较日期值)

5.3.2日期格式化的方法

toDateString(); //星期几、月、日和年

toTimeString(); // 时、分、秒和时区

toLocaleDateString(); //特定于地区的格式显示星期几、月、日和年

toLocaleTimeString(); //特定于时、分、秒

toUTCString()??//特定于实现的格式完整的UTC日期

5.3.3日期/时间组件方法（只列出常用的几项）

getTime() //日期毫秒数

setTime();//设置毫秒数

getFullYear():// 取得4位数的年份

setFullYear()//?设置日期的年份（4位数）

5.4 RegExp类型

var expression = / pattern(模式) / flags(标志);

g―表示全局(global)

i―表示不区分大小写(case-insensitive)

m―表示多行(multiline)

?5.4.1RegExp实例属性

global―布尔值，是否设置了g标志

ignoreCase―布尔值，是否设置了i标志

lastIndex―整数，表示开始搜索下一个匹配项的字符位置，从0算起

multiline―布尔值，表示是否设置了m标志

source―正则表达式的字符串表示，按照字面量形式返回

5.4.2RegExp实例方法

exec(): 返回包含第一个匹配项信息的数组，包含两个额外的属性：index和input。

index：匹配项在字符串中的位置。

input：应用正则表达式的字符串。

test(): 在模式与参数匹配的情况下，返回true,否则返回false

5.5Function类型

函数实际上是对象，每个函数都是Function类型的实例，与其他引用类型一样具有属性和方法，函数名实际上是指向函数对象的一个指针，不会与某个函数绑定。

/*函数声明语法*/
function sum(num1, num2){
            return num1 + num2;
        }

/*函数表达式定义*/
var sum = function(num1, num2){
            return num1 + num2;
        };

5.51没有重载

同名函数后面覆盖前面。

5.5.2函数声明与函数表达式

解析器先读取函数声明，使其咋子执行任何代码前可用，表达式是必须等到解析器执行到它所在的代码行才会真正执行。

5.5.3作为值的函数

将一个函数作为另一个函数的结果返回。

/*
*callSomeFunction是通用的，无论第一个参数中传递进来的是什么函数，都会返回执行第一个参数后的*结果。
*/
function callSomeFunction(someFunction, someArgument){
		return someFunction(someArgument);
}
function add10(num){
	return num+10;
}
var result1 = callSomeFunction(add10,10);
alert(result1);

function getGreeting(name){
	return "hello," + name;
}
var result2 = callSomeFunction(getGreeting,"flyer");
alert(result2);

/*
*从一个函数中返回另一个函数。
*simple：根据某个对象属性对数组进行排序
*/
function createComparisonFunction(propertyName){
	return function(object1,object2){
			var value1 = object1[propertyName];
			var value2 = object2[propertyName];
			if (value1 < value2){
				return -1;
			}else if (value1 > value2) {
				return 1
			}else{
				return 0;
			}
	};
}
var data = [{name:"flyer", age:26},{name:"bird",age:27}];
data.sort(createComparisonFunction("name"));
alert(data[0].name);//bird
data.sort(createComparisonFunction("age"));
alert(data[0].name);//flyer

5.5.4函数内部属性

arguments和this

arguments的主要用途是保存函数参数，还有一个callee的属性，是一个指针，指向拥有这个arguments对象的函数。

/*
function factorial(num){
	if(num <= 1){
		return 1;
	}else{
		return num * factorial(num-1)
	}
}
*/

//为了消除耦合，可以使用arguments.callee
function factorial(num){
	if(num <= 1){
		return 1;
	}else{
		return num*arguments.callee(num-1)
	}
}

var trueFactorial = factorial;
factorial = function(){
	return 0;//返回0的函数赋值给factorial变量
};

alert(trueFactorial(5));//120
alert(factorial(5));//0

this是函数在执行时所处的作用域。

用call,apply动态改变this指向。

5.5.5函数的属性和方法

每个函数都包含2个属性：

? ? 1）length：表示函数希望接受的命名参数的个数

? ? 2）prototype：保存它们所有实例方法

?每个函数都包含2个非继承而来的方法：

??? 1）apply()

????????? 接受两个参数，运行函数的作用域，参数数组（可以是Array的实例，也可以是arguments对象），

function sum(num1, num2){
            return num1 + num2;
        }
        
        function callSum1(num1, num2){
            return sum.apply(this, arguments);
        }
        
        function callSum2(num1, num2){
            return sum.apply(this, [num1, num2]);
        }
        
        alert(callSum1(10,10));   //20
        alert(callSum2(10,10));   //20

??? 2）call()

????????? 传递给函数的参数必须逐个列举出来。

?????????

 function sum(num1, num2){
            return num1 + num2;
        }
        
        function callSum(num1, num2){
            return sum.call(this, num1, num2);
        }
        
        alert(callSum(10,10));   //20

用途：在特定的作用域中调用函数，相当于设置函数体内this对象的值。

能够扩充函数赖以运行的作用域。

对象不需要与方法有任何耦合关系。

基本包装类型