`
bird12010
  • 浏览: 7485 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

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

阅读更多

引用类型

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

 

5.1 Object类型

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

创建Object的2种方式:

  1. 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对象的值。

 

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

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

 

基本包装类型

 

 

 

分享到:
评论

相关推荐

    JavaScript高级程序设计学习笔记(四)

    上半部分的笔记可以浏览JavaScript高级程序设计学习笔记(三) 以下的笔记是书上一些我以前学习的时候,没有太重视的js基础知识,也有一些面试知识的拓展,通过博客回顾并加深理解。 文章目录第五章(下)引用类型...

    JavaScript高级程序设计学习笔记(二)

    最近花了一天看完了第四章(变量、作用域和内存问题)和第五章(引用类型),然后隔天就被同学拉去干活了,身心俱疲。 先把第四章的笔记总结一下,怕回头忘光了哈哈。以下的笔记是书上一些我以前学习的时候,没有太...

    JavaScript高级程序设计(第3版)学习笔记9 js函数(下)

    还可以做为一个引用类型的值去使用,实际上我们前面的例子中已经有过将函数作为一个对象属性的值,又比如函数也可以作为另一个函数的参数或者返回值,异步处理中的回调函数就是一个典型的用法。 代码如下: var name ...

    JavaScript高级程序设计(第3版)学习笔记2 js基础语法

    JavaScript本质上也是一种类C语言,熟悉C语言的朋友,可以非常轻松的阅读这篇文章,甚至都可以跳过,不过建议你最好还是看一看,在介绍的同时,我可能会引用一些自认为不易理解且比较流行的用法。基础语法1、标识符...

    JavaScript高级程序设计(第3版)学习笔记7 js函数(上)

    2、变量的数据类型:就是指变量可以存储的值的数据类型,比如Number类型、Boolean类型、Object类型等,在ECMAScript中,变量的数据类型是动态的,可以在运行时改变变量的数据类型。 3、变量类型:是指变量本身的...

    my_demos:深入前端核心理论,记录个人博客

    撰写不易,望多多包涵,多多 star,转载请说明markdown 暂不支持新标签打开,为了更好阅读体验请右键“新标签页”打开《JavaScript 高级程序设计(第三版)》学习笔记:第 5 章:引用类型第 6 章:面向对象的程序...

    值类型与引用类型理论内容.part01.rar

    ASP.NET培训资料(笔记版)(AJAX,C#,JavaScript,SQL) 详细的资料 三个月的课程录像+资料笔记(花了一万六千块的培训资料超值【19G的经典内容】 认真学习后包你能成为优秀的.net程序员 &lt;br&gt;(注明:不是...

    值类型与引用类型理论内容.part05.rar

    C#,JavaScript,SQL) &lt;br&gt;我将不定期发布,直至所有课程完毕 &lt;br&gt;详细的资料 三个月的课程录像+资料笔记(花了一万六千块的培训资料超值【19G的经典内容】 认真学习后包你能成为优秀的.net程序员 ...

    asp.net知识库

    VS2005 ASP.NET本地化学习笔记&感受 在自定义Server Control中捆绑JS文件 Step by Step 深度解析Asp.Net2.0中的Callback机制 使用 Web 标准生成 ASP.NET 2.0 Web 站点 ASP.NET 2.0基于SQLSERVER 2005的aspnetdb.mdf...

Global site tag (gtag.js) - Google Analytics