一.引用类型的值(对象)是引用类型的一个实例。引用类型是一种数据结构,用于将数据与功能组织在一起。ECMAScript有一些内置引用类型(如Object)可以用来创建特定的对象。

对象是某个特定引用类型的实例。新对象是使用new加构造函数创建。

二.Object类型

到目前为止,我们看到的大多数引用类型值都是Object类型的实例。

1.Object是一个基础类型,其他所有类型都从Object继承了基本的行为,多用于存储和传递数据

2.创建Object实例的方法

(1)使用new操作符后跟Object构造函数

var person=new Object();
person.name="liu";
person.age=21;

(2)对象字面量法

var person={
    name:"liu",  //用逗号
    age:21       //不能添加逗号
};
 
var person={};   //与var person=new Object()相同

3.访问对象的属性

person.name

person[“name”]  //访问属性以字符串的形式放到方括号中

从功能上看,以上两种访问对象属性的方法没有任何区别。但方括号语法的主要优点是可以通过变量来访问属性

var propertyName=”name”;

person[propertyName]; //通过变量访问属性。

注意:除非必须使用变量来访问属性,否则我们建议使用点方法

三.Array类型

1.ECMAScript中的数组与其他多数语言中的数组有着相当大的区别。相同点是:数组都是数据的有序列表。不同点:ECMAScript数组的每一项可以保存任何类型的数据。而且,ECMAScript数组大小是可以动态调整的,即可以随着数据的添加自动增长以容纳新增数据。

2.创建数组(与Object类型一样)

(1)new操作符

var color=new Array();

var color=new Array(20);

var color=new Array(“red”,"blue”);

(2)对象字面量法

var color=[“red”,"blue”];

3.length属性

(1)在数组末尾添加新项color[color.length]=”black”

(2)数组最后一项length-1,并且length属性不是只读的,可以设置。

4.检测数组

if(value instanceof Array){}

instanceof操作符的问题在于,它假定只有一个全局执行环境。当网页包含多个框架,就存在多个不同的全局执行环境,从而存在多个不同版本的Array构造函数。如果你从一个框架向另一个框架传入数组,就会存在问题。

以下这个方法(ES5新增)可以解决这个问题。这个方法的目的是最终确定某个值(value)到底是不是数组。

if(Array.isArray(value)){}

5.转换方法

(1)toLocaleString(),toString(),valueOf()

valueOf()返回数组本身,toString()返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔字符串,toLocaleString()类似。

直接alert  color这个数组对象时,即alert(color),调用的是toString()方法

join方法可以使用不同的分隔符来构建这个字符串。

注意:如果数组某一项的值是null或者undefined时,使用toLocaleString()、toString()、valueOf()、join()方法返回的结果中以空字符串表示。

(3)join()方法

alert(color.join(|))

(4)如果数组中的某一项是null或undefined,则返回空字符串

6.栈方法

栈数据结构:后进先出

push()添加到数组末尾,返回新的数组的长度push(“red”,"black”) //2

pop()从末尾移除最后一项,返回移除的项

7.队列方法

队列数据结构:先进先出

shift()移除数组的第一项,返回移除的项

unshift()添加到数组前端,返回新的数组长度

8.重排序方法

(1)reverse()翻转数组项的顺序

(2)sort()

默认是升序,sort方法会调用每个数组项的toString(),比较得到的字符串。

10在数值上大于5,但是在字符串比较时,“10”位于“5”的前面。所以,这种排序并不是最佳的,因此sort方法可以接受一个比较函数作为参数

升序:value.sort(compare),compare函数接收两个参数

第一种比较函数(升序):

function compare(value1,value2){
    if(value1<value2){
        return -1;
    }
    else if(value1>value2){
        return 1;
    }
    else{
        return 0;
    }
}
第二种比较函数:(数值类型的数组或valueOf()方法返回数值类型的对象类型)
function compare(value1,value2){
    return value2-value1;
}
9.操作方法
(1)concat()将参数添加到原有数组中,参数可以是字符串或数组,返回新数组
(2)slice(起始位置,结束位置)
若只有一个参数,则返回从该项参数指定位置开始到末尾的所有项,不包括末尾项。slice方法不会影响原始数组。
若参数为负,则用数组长度加上该数来确定位置。
(3)splice()方法主要用于向数组的中部插入项。包含3个参数。
实现替换:splice(起始位置,要删除的项,要插入的项)。以下是其他功能
插入:splice(起始位置,0,要插入的项)
删除:splice(要删除的第一项的位置,要删除的项数)
splice()方法返回删除的项组成的数组
10.位置方法
(1)indexOf(要查找的项,(可选)查找起点位置的索引)
(2)lastIndexOf()从数组末尾向前查找
这两个方法都返回查找项在数组中的位置。在找到查找项第一次出现的位置后返回
11.迭代方法
every(),filter(),forEach(),map(),some()这5个迭代方法。
每个方法都接收两个参数:要在每一项上运行的函数(接收三个参数)和(可选的)运行该函数的作用域对象——影响this的值。
接收的这三个参数:数组项的值,该项在数组中的位置,数组对象本身
var number=[1,2,3,4,5];
var result=number.every(function(item,index,array){
    return (item<2);
})
alert(result); //false 可以理解为要让array的每一个item都小于2才能返回true,number数组只有第一个值满足,因此返回false。如果换成some方法的话则返回true
filter()方法:对数组的每一项运行给定函数,返回该函数会返回true的项组成的数组
forEach():对数组的每一项运行给定函数,没有返回值。本质上与for循环迭代数组一样
map():对数组的每一项运行给定函数,返回每次函数调用的结果组成的数组。可以这样理解,map有匹配的意思。匹配到每一项,并对每一项做给定的函数处理,处理后的结果组成的数组即是map()方法的返回值。
注意:后面这三个方法在实际中比较常用。(配合ES6箭头函数使用)

12.归并方法

reduce() //从左到右遍历

reduceRight()//从右到左遍历

迭代数组中所有项,并构建一个最终返回值

接受要在每一项上运行的函数

该函数四个参数:前一个值,当前值,项的索引,数组对象

例:

var result=[1,2,3,4,5];
var sum=result.reduce(function(prev,cur,index,array){
    return prev+cur;
});
alert(sum);  //15

四.Date类型

1.创建日期对象

var now=new Date();

2.根据特定的日期和时间创建日期对象

(1)Date.parse()方法:

var someDate=new Date(Date.parse(“May 12.2004”));//等于var someDate=new Date(“May 12.2004”);

(2)Date.UTC()方法:

年和月是必需的(天数默认为1,其他为0),基于零的月份

var someDate=new Date(Date.UTC(2013,10,28,22,0,0)); //2013年11月28日10点0分0秒

等同于var someDate=new Date(2013,10,28,22,0,0);

3.Date.now()方法:返回调用这个方法时的日期和时间的毫秒数

var nowtime=Date.now(); //等同于var nowtime= +new Date();

4.继承的方法

(1)toLocaleString():时间格式包含AM PM

(2)toString():带有时区信息

(3)valueOf():返回日期的毫秒,可用于比较日期值

var Date1=new Date(2013,10);

var Date2=new Date(2013,11);

alert(Date1<Date2); //true

5.日期、时间组件方法

getMonth()(基于0的月份)

getDay()(基于0的星期几)

五.RegExp类型

1.字面量形式定义正则表达式

var pattern1=/pattern/flags;

flags有三种:g,i,m

2.使用RegExp构造函数定义正则表达式

var pattern1=new RegExp(“liu”,"i”) //接受两个字符串

3.元字符转义??

4.循环中字面量始终使用同一个RegExp实例,而使用RegExp构造函数每次循环都会创建新的实例

5.RegExp实例属性

6.RegExp实例方法

(1)exec()                                   //再看

(2)test():

接受一个字符串参数,在模式与该参数匹配的情况下返回true

2
3
4
5
6
var text="000-00-0000";
var pattern=/\d{3}-\d{2}-\d{4}/;
if(pattern.test(text)){
    alert("it is true");
}

7.字面量和构造函数的toLocaleString() toString()方法都会返回字面量

8.RegExp构造函数属性

用于从exec() test()中提取中更具体的信息

RegExp.input

RegExp.lastMatch

RegExp.paren

RegExp.leftContext

RegExp.rightContext

RegExp.multiline

六.Function类型

1.函数实际是对象,每个函数都是Function类型的实例,函数名是指向函数对象的指针

2.构造函数

(1)function sum(num1,num2){
        return num1+num2;
    }

(2)var num=function(num1,num2){
        return num1+num2;
    };

(3)var num=new Function("num1","num2","num1+num2"); //不推荐

函数名与包含对象指针的其他变量没什么区别,一个函数可以有多个名字

3.没有重载

两个同名函数,创建第二个函数时,第二个函数覆盖了第一个函数

4.函数声明与函数表达式

解析器会率先读取函数声明,表达式会在解析器执行到它时才解释执行

2
3
4
5
alert(sum(10,20));
var sum=function(sum1,sum2){
    return sum1+sum2;
}; //会出错,无法读取函数声明,变量sum不会保存函数的指针,因为没有执行到那

5.作为值的函数

(1)把一个函数传递给另一个函数

2
3
4
5
function callSomeFunction(someFunction,someArgument){
    return someFunction(someArgument);
}
//第一个参数是一个函数,第二个参数是传给该函数的值,返回执行完第一个参数后的结果
2
 
2
3
4
5
6
function add(num){
    return num+10;
}
var result=callSomeFunction(add,10);//<strong>这里访问函数的指针而不执行函数,去掉函数名后的圆括号</strong>
alert(result);//20
2
(2)从一个函数返回另一个函数
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function myFunction(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:"zhong",age:21},{name:"liu",age:22}];
data.sort(myFunction("name"));
alert(data[0].name); //liu
 
data.sort(myFunction("age"));
alert(data[0].name); //zhong

6.函数内部属性

两个特殊的对象

(1)arguments对象:类数组对象,包含传入函数的所有参数,有一个callee属性,该属性是一个指针,指向拥有这个arguments对象的函数

递归算法:

2
3
4
5
6
7
8
9
function myFunction(num){
    if(num<=1){
        return 1;
    }else{
        return num*arguments.callee(num-1); //避免耦合,不受函数名影响
    }
}
alert(myFunction(5)); //120

(2)this对象:引用函数执行时的环境对象

2
3
4
5
6
7
8
9
window.color="red";
var o={color:"blue"};
function sayColor(){
    alert(this.color);
}
sayColor();  //"red"
o.sayColor=sayColor;  //访问函数的指针而不执行函数,要去掉函数名后边的圆括号
o.sayColor(); //"blue"

(3)caller

7.函数属性和方法

函数是对象,所以函数也有属性和方法

属性:length,prototype

(1)length属性:表示函数接受命名参数的个数

2
3
4
5
function sum(sum1,sum2){
    return sum1+sum2;
}
alert(sum.length);  //2

(2)prototype属性:用于保存引用类型的所有实例方法

方法:apply(),call(),bind()

可以传递参数

(1)apply():接受两个参数apply(this,参数数组)

2
3
4
5
6
7
8
function sum(num1,num2){
    return sum1+sum2;
}
function sum1(num1,num2){
    return sum.apply(this,arguments);//或apply(this,[num1,num2])
}
alert(sum1(10,10)); //20

(2)call():

2
3
4
5
6
7
8
function sum(num1,num2){
    return sum1+sum2;
}
function sum1(num1,num2){
    return sum.call(this,num1,num2);//参数必须列举出来
}
alert(sum1(10,10)); //20

扩充函数运行的作用域

2
3
4
5
6
7
8
9
10
11
window.color="red";
var o={color:"blue"};
function sayColor(){
    alert(this.color);
}
sayColor();  //"red"
 
sayColor.call(this); //red
sayColor.call(window); //red
sayColor.call(o); //blue

bind()创建一个函数的实例

2
3
4
5
6
7
8
window.color="red";
var o={color:"blue"};
function sayColor(){
    alert(this.color);
}
var objectSayColor=sayColor.bind(o);
objectSayColor(); //blue

七.基本包装类型

因为有基本包装类型,所以js中的基本类型值可以当做对象来访问,三种基本包装类型:Boolean,Number,String

(1).每个包装类型都映射到同名的基本类型

(2).在读取模式下访问基本类型时,就会创建对应的基本包装类型的一个对象,从而进行数据操作

(3).操作基本类型的语句一执行完,就会立即销毁新创建的包装对象

2
3
4
5
var s1="some text";
var s1=new Stirng("some text");//后台自动创建基本包装类型的对象
var s2=s1.substring(2);
s1=null;                       //执行完后立即销毁

(4).对基本包装类型的实例调用typeof会返回"object”,而且所有基本包装类型的对象都会被转换为布尔值true

2
3
4
var message=new Boolean(false);     //不建议实例化
var result=message &amp;&amp; true;  //message转换为true
alert(result);  // true

1.Boolean类型

Boolean类型是与布尔值对应的引用类型

基本类型与引用类型的布尔值的区别(所以不建议实例化,会造成混淆):

(1)typeof对基本类型返回“boolean”,对引用类型返回“object”

(2)instanceof检测Boolean对象返回true,检测基本类型的布尔值返回false

2.Number类型

Number是与数字值对应的引用类型

(1)创建Number对象,会调用Number构造函数,向其中传递相应的数值

var numberObject=new Number(10); //不建议实例化 因为

(2)Number类型重写了valueOf()//返回基本类型表示的数值,toLocaleString(),toString()//返回字符串形成的数值

var num=10;

alert(num.toString()); //10

alert(num.toString(2)); //1010

(3)toFixed方法

(4)toPrecision方法

(5)typeof,instanceof检测的区别

3.String类型

Stirng类型时字符串的包装类型,使用String构造函数来构建

var stringObject=new String(“hello world”);

Stirng类型的方法:

(1)字符方法:用于访问字符串中特定字符

charAt()

charCodeAt()

(2)字符串操作方法

concat()用于拼接字符串,一般用+代替

slice(子字符串的开始位置,结束位置的后一个位置)

substring(子字符串的开始位置,结束位置的后一个位置)

substr(子字符串的开始位置,子字符串的字符个数)

参数为正的情况下返回基本相同,为负时有较大区别,不详述

(3)字符串位置方法

indexOf(“要查找的字符","开始查找的位置") //顺序查找

lastIndecOf() //逆序查找

2
3
4
5
6
7
8
9
var myString="hello world";
var position=new Array();
var pos=myString.indexOf("o");
while(pos>-1){
    position.push("pos");
    pos=myString.indexOf("o",pos+1);
}
alert(position);
2
<font face="Verdana">(4)trim()</font>
2
<font face="Verdana">删除字符串前置和后缀的空格</font>
2
3
4
5
var myString=” hello world ”;
var newString=myString.trim();
alert(newString); //”hello world”
alert(myString);  //”    hello world    ”创建的是字符创的副本,所以不改变原字符串

(5)字符串大小写转换

toUpperCase()

toLocaleUpperCase() //针对特定地区,在不知道代码在何处运行时使用

toLowerCase()

toLocaleLowerCase()

(6)字符串模式匹配方法

match() : //再看

search():接受一个由字符串或者RegExp对象指定的正则表达式,返回字符串中第一个匹配项的索引

replace(字符串或RegExp对象,字符串或函数) //不详写用法

split():指定分隔符,将字符串分割成多个子字符串,并将结果放到数组中,第一个参数为分割符,第二个为数组的大小

(7)localeCompare()方法

比较两个字符串,返回-1,0,1

(8)fromCharCode():String构造函数的一个静态方法,接受一或多个字符编码,转换成字符串

alert(String.fromCharCode(104,101,108,108,111)); //”hello”

(9)HTML方法

八.单体内置对象

1.Global对象

所有在全局作用域中定义的属性和函数都是Global对象的属性

(1)URI编码方式

对URI进行编码,以便发送给浏览器,有效的URI中不能包含某些字符,例如空格,所以要进行编码

encodeURI()

encodeURIComponent()

decodeURI()

decodeURIComponent()

(2)eval()方法

像一个ECMAScript解析器,接受要执行的ECMAScript字符串作为参数,并执行

(3)Global对象的属性

undefinded,NaN,Number,String,Boolean,Object,Function,Array,Infinity,Date,RegExp,Error等

(4)window对象

Web浏览器将Global对象作为window对象的一部分,在全局作用域中声明的所有变量和函数,就成了window对象的属性

2
3
4
5
6
var color="red";
functin sayColor(){
    alert(window.color);
}
window.sayColor(); //"red"

2.Math对象

(1)Math对象的属性

Math.PI//π的值

Math.SQRI2//2的平方根

(2)min() max()方法

2
3
4
5
6
7
8
9
10
11
12
var max=Math.max(3,4,5);
 
alert(max);//5
 
var min=Math.min(3,4,5);
 
alert(min);//3
 
var values=[1,2,3,4];
 
var max=Math.max.apply(Math,values);

(3)舍入方法

Math.ceil()向上舍入

Math.floor()向下舍入

Math.round()标准舍入,四舍五入

(4)random()方法

Math.random()返回0到1的随机数

从某个整数范围内随机选择一个值:

值=Math.floor(Math.Random()*可能值的总数+第一个可能的值)

例:2到10的整数:Math.floor(Math.Random()*9+2); //2到10有9个数

写成函数:

2
3
4
5
6
7
function getRandom(min,max){
    var length=max-min+1;
    return Math.floor(Math.Random()*length+min);
}
var result=getRandom(2,10);
alert(result);

(5)其他方法

Math.tan(x);

Math.sin(x);

Math.cos(x)等