一、基本类型和引用类型基础知识点
1.基本类型和引用类型的值
5中基本数据类型(number,string,boolean,null,undefined):按值访问
引用类型:引用类型的值是保存在内存中的对象
(1)当,复制保存着对象的某个变量时,操作的是对象的引用
(2)当,为对象添加属性时,操作的是实际的对象
*我们可以给引用类型的值动态的添加属性,基本类型不可以(赋予基本类型添加属性的语句不会出错,但访问这个属性时,会发现是undefined)
2.关于参数传递的说明
基本类型和引用类型的参数都是按值传递的
3.类型检测
用instanceof检测引用类型的值(所谓引用类型的值,可以理解为是某个引用类型的一个实例,也就是一个对象)
例如:
alert(person instanceof Object);//所有引用类型的值都是Object的实例,这里始终会返回true
alert(colors instanceof Array);
alert(pattern instanceof RegExp);
二、引用类型详解
1.Object类型
创建Object实例:
(1)var person=new Object();
person.name="Nicholas";
person.age=29;
(2)使用对象字面量表示法
var person={
name:"Nicholas",
age:29
};
或属性名可以用字符串
var person={
"name":"Nicholas",
"age":29,
5:true //这里的数值属性名会自动转换为字符串
};
或留空对象的花括号,可以定义只包含默认属性和方法的对象
var person={}; //与new Object()相同
person.name="Nicholas";
person.age=29;
2.Array类型
检测数组的方法:Array.isArray(value);
转换方法:
var colors=["red","blue","green"];
alert(colors); //red,blue,green 说明:这里会默认调用每一个数组项的toString()方法
Array类型的一些方法:
(1)join()方法:
指定数组toString()后分隔符样式的方法
例如:alert(colors.join("||")); //red||blue||green
(2)push()、pop()方法:
在数组末端添加或删除--二者都属于栈方法,数组末端相当于栈顶
push()方法可以传递参数,即,传递要添加到数组中的元素
例如:
colors.push("black","yellow");
(3)shift()方法:
删除数组的第一项--shift()+push()可以实现队列(先进先出)
unshift()方法:
在数组前端添加--和push()的区别只是添加的方向不同,一个在队首添加,一个在队尾添加
unshift()和push()一样,也可以传递参数
unshift()+pop()可以模拟反向队列(即:首部进,尾部出)
(4)reverse()方法:反转数组项的顺序
即:
var values=[1,2,3,4,5];
values.reverse();
alert(values); //5,4,3,2,1
(5)sort()方法:默认升序排列
原理:sort()方法会调用每个数组项的toString()方法,然后比较得到的字符串。
注意:因为sort()方法默认比较的是字符串,因此,它的升序是根据ASSIC字符编码的大小升序排列。
例如:
var values=[0,1,5,10,15];
values.sort();
alert(values); //0,1,10,15,5 注意:这就是按照字符串比较的结果
改进:
sort()方法可以接收一个比较函数作为参数,这样,我们可以根据自己的规定,对数组项进行排序
比较函数接收两个参数a、b,如果我们希望,排序后a位于b之前,则让比较函数返回一个负数,如果希望排序后a位于b之后,则让比较函数返回一个正数。如果两个参数相等,则返回0。
例如:
<span style="font-family:KaiTi_GB2312;font-size:14px;"><span style="font-family:KaiTi_GB2312;font-size:14px;">function compare(value1,value2){ //实现升序排列(降序同理)
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
}
}</span></span>
这个比较函数可以适用于大多数数据类型
调用举例:
<span style="font-family:KaiTi_GB2312;font-size:14px;"><span style="font-family:KaiTi_GB2312;font-size:14px;">var values=[0,1,5,10,15];
values.sort(compare);
alert(values); //0,1,5,10,15</span></span>
优化(常用):
对于数值类型,或者其valueOf()方法会返回数值类型的对象类型,可以用如下优化的方法实现排序:
<span style="font-family:KaiTi_GB2312;font-size:14px;"><pre name="code" class="javascript"><span style="font-family:KaiTi_GB2312;font-size:14px;">function compare(value1,value2){//优化的比较函数
return value1-value2; //升序(降序返回value2-value1)
}</span></span>
(6)concat()方法:
复制当前数组的一个副本,并向其中添加数组项
例如:
var colors=["red","blue","green"];
var colors2=colors.concat("yellow",["black","brown"]);
alert(colors); //red,blue,green 注意:原数组不变
alert(colors2); //red,blue,green,yellow,black,brown
(7)slice()方法:
复制当前数组的某些项,并存到一个新的数组中
两个参数:截取的开始位置、截取的结束位置(截取规则,左闭右开。若不传结束位置,截到数组末尾)
例如:
var colors=["red","blue","green","yellow"];
var colors2=colors.slice(1,3);
alert(colors2); //blue,green
特殊情况:
当传入的参数中有负数:用数组长度加上这个负数,得到正确的参数。例如:假设数组长度为5,slice(-2,-1)与slice(3,4)结果相同。
如果传入的结束位置小于开始位置:返回空数组
(8)splice()方法:
作用:删除,插入,替换数组元素。
可以传入的前两个参数:要删除的第一项的位置、要删除的项数
splice(0,2); //删除数组前两项
splice(2,0,"red","green"); //从当前数组的位置2开始插入两项
splice(2,1,"red","green"); //删除当前数组的第二项,然后从位置2开始插入新的两项
注意:
splice()方法返回的是一个数组,该数组中的元素,是通过splice()方法从原数组中删除的那些元素
(9)indexOf()、lastIndexOf()方法:
作用:查找指定元素在数组中的位置(indexOf()从前往后找,lastIndexOf()从后往前找)
例如:
var numbers=[1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3
alert(numbers.lastIndexOf(4)); //5
注意:这里要求,查找到的项与指定项要严格等于,即"==="
两个方法也可以多传递一个参数,指明从数组的第几项开始查找
例如:
alert(numbers.indexOf(4,4)); //5
alert(numbers.lastIndexOf(4,4)); //3
(10)迭代方法
对数组中的每一项运行指定函数:
every():如果该函数的每一项都返回true,则返回true
some():只要有一项返回true,就返回true
filter():返回该函数会返回true的项组成的数组
map():返回每次函数调用的结果组成的数组
forEach():这个方法没有返回值
以上5个方法都接收两个参数:
要在数组每一项上运行的函数、运行该函数的作用域对象(可选)
传入方法中的函数,接收三个参数:
数组项的值(item)、该项在数组中的位置(index)、数组对象本身(array)
例如:
every()和some():
<pre name="code" class="javascript"><span style="font-family:KaiTi_GB2312;font-size:14px;">var numbers=[1,2,3,4,5,4,3,2,1];
var everyResult=numbers.every(function(item,index,array){
return (item>2);
});
alert(everyResult); //false
var someResult=numbers.some(function(item,index,array){
return (item>2);
});
alert(someResult); //true</span>
filter():
<span style="font-family:KaiTi_GB2312;font-size:14px;">var numbers=[1,2,3,4,5,4,3,2,1];
var filterResult=numbers.every(function(item,index,array){
return (item>2);
});
alert(filterResult); //[3,4,5,4,3]</span>
(11)归并方法
reduce()、reduceRight()
两个方法都接收两个参数:
要在数组每一项上运行的函数、作为归并基础的初始值(可选)
传入方法中的函数,接收四个参数:
前一个只、当前值、项的索引、数组对象
例如:
<span style="font-family:KaiTi_GB2312;font-size:14px;">var values=[1,2,3,4,5];
var sum=values.reduce(functon(prev,cur,index,array){
return prev+cur;
});
alert(sum); //15</span>
注:第一次迭代发生在数组的第二项上,即:第一次执行回调函数,prev=1,cur=2,第二次执行时,prev=上次调用的返回值(在本例中,就是1+2的值,即3),cur=当前数组项的值。reduceRight()的原理和reduce()相同,区别只是遍历的方向,reduceRight()从数组末尾向前遍历。
3.Date类型
(1)Date.parse()、Date.UTC()方法:
作用:返回传入日期的毫秒数(传入日期距1970年1月1日的毫秒数)
二者区别:构建日期对象时,使用不同的信息(即信息参数格式不同)
例如:
var someDate=new Date(Date.parse("May 25,2004")); //为指定的2004年5月25日创建一个日期对象
var someDate=new Date("May 25,2004"); //这个作用与上一个一样,后台会自动调用Date.parse()
如果传入的字符串不能表示日期,Date.parse()返回NaN
var y2k=new Date(Date.UTC(2000,0)); //2000年1月1日午夜0时 参数说明:2000--年份,0--月份(0-11对应1-12月)
var allFives=new Date(Date.UTC(2005,4,5,17,55,55)); //参数说明:年、月、日、时、分、秒(注意月份这里是5月)
Date.UTC传入的参数,只有年月是必须的,其他参数不传入时,日期默认1日,其他默认为0
通过调用Date.UTC()创建的日期对象,都是基于GMT创建的
var y2k=new Date(2000,0); //作用与调用Date.UTC相同,唯一的区别是:这样创建的日期对象时基于本地时间的
var allFives=new Date(2005,4,5,17,55,55);
(2)Date.now()方法:
作用:返回当前系统时间毫秒数
好处:可以直接用来计算时间差
例如:
var start=Date.now();
doSomething(); //调用某些函数
var stop=Date.now();
result=stop-start;
在不支持这个方法的浏览器中:var time=+new Date(); 用这种方式把Date对象转换成字符串,也可以达到相同的目的
附:日期对象可以直接比较大小,因为默认调用Date的valueOf()方法,该方法返回的不是字符串,而是日期的毫秒数
4.RegExp类型
正则表达式创建方式1(以字面量形式定义):
var expression=/pattern/flags;
pattern:正则表达式
flags:一个或多个标志,标志可选:
g:全局模式,即模式将被应用于所有字符串,而不是在发现第一个匹配项时立即停止
i:不区分大小写模式,即匹配时不区别字母的大小写
m:多行模式,即在到达一行文末时,还会继续查找下一行中是否存在与模式匹配的项
例如:
//匹配字符串中所有"at"的实例
var pattern1=/at/g;
//匹配第一个"bat"或"cat",不区分大小写
var pattern2=/[bc]at/i;
//匹配所有以"at"结尾的3个字符的组合,不区分大小写
var pattern3=/.at/gi;
注意:需要转义的元字符:
( ) [ ] { } + * / ^ = | \ : ? ! $ .
例如:
//匹配第一个"[bc]at",不区分大小写
var pattern2=/\[bc\]at/i;
正则表达式创建方式2(使用RegExp构造函数形式定义):
构造函数接收两个参数(都是字符串):
要匹配的字符串形式、标志字符串(可选)
例如:
var pattern2=new RegExp("[bc]at","i");
关于元字符的转义注意:
这里,字符串里面的匹配项要双重转义。简单的记,就是,如果在var pattern2=/\[bc\]at/i;这样的字面量表示时,需要用到一个转义符 "\",那么,在正则表达式字符串中就要用到两个"\",即:"\\"。同理,如果字面量表示时,需要两个转义符"\\"转义,那么,字符串中要用四个转义符,即:"\\\\"。
两种创建方式的区别:
RegExp实例属性:
global:检测是否设置了g标志,布尔值
ignoreCase:检测是否设置了i标志,布尔值
multiline:检测是否设置了m标志,布尔值
lastIndex:开始搜索下一个匹配项的位置,整数,从0算起
source:正则表达式的字符串表示,返回的是字面量形式的字符串表示,不是传入构造函数中的字符串表示
用法举例:
var pattern2=/\[bc\]at/i;
alert(pattern2.global); //false
alert(pattern2.source); //"\[bc\]at" 注意:这里返回的只是正则表达式,不包含标志位
RegExp实例方法:
test()方法:
返回true或false,表示是否匹配成功。test()传入要检测的字符串,用指定匹配字符的正则表达式调用。(pattern.test(text);)
exec()方法:
传入:接收一个参数,即:要测试是否与正则表达式匹配的字符串
返回:返回包含第一个匹配项信息组成的数组,也就是,测试的字符串中,和正则的每个捕获组匹配的那些部分组成的数组,如果对一个捕获组,有多个匹配字段,则取第一个放入返回数组。
另:返回的数组是Array的实例,但包含两个额外的属性,index和input,index:匹配项在测试字符串中的位置,input:应用正则表达式的字符串(即测试字符串)
举例说明:
var text="mom and dad and baby";
var pattern=/mom( and dad( and baby)?)?/gi; //?的含义:匹配前一项0次或1次
var matches=pattern.exec(text);
alert(matches.index); //0
alert(matches.input); //"mom and dad and baby" 即:测试的字符串
alert(matches[0]); //"mom and dad and baby"
alert(matches[1]); //" and dad and baby"
alert(matches[2]); //" and baby"
注:正则表达式如果未设置全局标志g,每调用一次exec(),返回的都是第一个匹配项。如果设置了g,每调用一次,返回的都是下一个匹配项,直到搜索到字符串末尾为止。
5.Function类型
函数的属性和方法:
每个函数都包含两个属性:
length:函数希望接收的命名参数的个数--即:function()括号里参数的个数
prototype:原型属性
每个函数都包含两个非继承而来的方法:
apply()、call()
作用1:传递参数
apply()接收两个参数:
在其中运行函数的作用域、参数数组(可以是Array的实例,也可以是arguments对象)
例如:
<span style="font-family:KaiTi_GB2312;font-size:14px;">function sum(num1,num2){
return num1+num2;
}
function callSum1(num1,num2){
return sum.apply(this,arguments); //传入arguments对象 apply()方法的含义:在当前这个方法中,调用sum()
}
function callSum2(num1,num2){
return sum.apply(this,[num1,num2]); //传入数组
}
alert(callSum1(10,10)); //20
alert(callSum2(10,10)); //20</span>
call()与apply()的区别是:
调用call()时,第二个参数必须逐个列出来,不能用数组或arguments对象。即:sum.call(this,num1,num2);
作用2:扩展函数作用域
例如:
<span style="font-family:KaiTi_GB2312;font-size:14px;">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)</span><span style="font-size:18px;">; //blue</span>
这里,有一个bind()方法,它会创建一个函数的实例,其this值会被绑定到传给bind()函数的值,例如:
<span style="font-family:KaiTi_GB2312;font-size:14px;">window.color="red";
var o={color:"blue"};
function sayColor(){
alert(this.color);
}
var objectSayColor=sayColor.bind(o);
objectSayColor(); //blue</span>
6.基本包装类型
一些方法记录:
Number类型:
var num=10;
alert(num.toFixed(2)); //"10.00" 显示两位小数,注意,返回的是字符串表示
alert(num.toExponential(1)); //"1.0e+1" 返回指数表示(即科学计数法)
var num2=99;
alert(num2.toPrecision(1)); //"1e+2"一位数无法准确表示99,故向上舍入为100。该方法会自动判断,显示出表示数值的最合适格式。括号里的数字,指定数值的总位数,方法根据这个位数,选择最合适的表示法。
alert(num2.toPrecision(2)); //"99"
alert(num2.toPrecision(3)); //"99.0"
String类型:
var str="hello world!";
alert(str.charAt(1)); //返回位于位置1的字符--"e"
alert(str.charCodeAt(1)); //返回位于位置1的字符的编码--"101"(e的编码)
alert(str[1]); //"e"
trim():去掉字符串首尾空格
match():字符串匹配方法,var matches=text.match(pattern);pattern要么是一个正则表达式,要么是一个RegExp对象。返回一个数组。
search():同上。但返回的是字符串中第一个匹配项的索引。如果没有匹配项,返回-1。
replace():例如:
var text="car,bat,sat";
var result=text.replace("at","ond");
alert(result); //"cond,bat,sat"
result=text.replace(/at/g,"ond");
alert(result); //"cond,bond,sond"
localeCompare():
作用:比较两个字符串,并返回一个数值(正、负或0)
例如:
var str="yellow";
alert(str.localeCompare("brick")); //1 因为"yellow">"brick"
alert(str.localeCompare("yellow")); //0
alert(str.localeCompare("zoo")); //-1 因为"yellow"<"zoo"
fromCharCode():
与charCodeAt()相反的操作
例如:
alert(String.fromCharCode(104,101,108,108,111)); //"hello"