前面講過(guò),根據(jù)內(nèi)存不同。變量分為:基本數(shù)據(jù)類型和引用類型
對(duì)象是某個(gè)特定引用的實(shí)例。新對(duì)象是使用new操作符,緊跟一個(gè)構(gòu)造函數(shù)。
1.Object數(shù)據(jù)類型。
1.
創(chuàng)建Object實(shí)例方法。
//第一種:構(gòu)造函數(shù)創(chuàng)建
var obj = new Object();
obj.age = 12;
//第二種:字面量創(chuàng)建,不會(huì)調(diào)用Object構(gòu)造函數(shù)
var person = {
age:12
}
var person1= {};
person.age = 12;
注意:字面量創(chuàng)建,索引會(huì)自動(dòng)轉(zhuǎn)換為字符串。
2.屬性訪問(wèn)
1.
一般來(lái)講,我們都是采用.屬性進(jìn)行訪問(wèn)屬性值的。
2.
但是,我們也可以采用[屬性]進(jìn)行屬性值訪問(wèn)。
使用方法區(qū)別:
一般我們使用.屬性。但是有些屬性里面包含了空格或者采用變量的方法進(jìn)行訪問(wèn)的時(shí)候,我們就使用[屬性]進(jìn)行訪問(wèn)。
2.Array類型
數(shù)組的每一項(xiàng)都可以保存不同的類型的值
1.
創(chuàng)建數(shù)組的方法
//第一種方法:
var color = new Array();
//如果事先知道數(shù)組的大小,還可以傳入數(shù)組的大小,或者值
var color1 = new Array(20);//每一個(gè)值都是undefined
var color2 = new Array("red", "blue", "green");
//第二種方法
var color3 = ["yellow", "white", "pink"];
//注意不要這樣
var color3 = ["yellow", "white", ];//很容易報(bào)錯(cuò)
2.
length屬性
數(shù)組的length屬性,可以返回?cái)?shù)組的長(zhǎng)度。但是這個(gè)屬性并不是只讀的,是可以設(shè)置的。
var color = ["yellow", "white", "pink"];
color[2]//pink
color.length = 2;
color[2]//undefined
如果length大于數(shù)組的值,后面會(huì)添加empty值(undefined),如果小于,那樣就會(huì)移除數(shù)組的值。數(shù)組是有一定長(zhǎng)度的,超出了會(huì)影響性能并且發(fā)生異常。
3.
檢測(cè)數(shù)組
1.value instanceof Array
之前講過(guò)instanceof的原理:左邊的原型鏈上能否找到右面的prototype相對(duì)應(yīng)的值。但是它有局限性。不同的全局環(huán)境,構(gòu)造函數(shù)的prototype是不相同的。
2.Array.isArray(value)
4.
轉(zhuǎn)換方法
1.所有對(duì)象都有toLocalString(),toString(),valueOf()方法。注意null和undefined沒(méi)有這些方法
[1, 2].toString(); //"1,2"
toLocalString(); //會(huì)調(diào)用數(shù)組每一項(xiàng)的toLocalString
toString();//會(huì)調(diào)用數(shù)組每一項(xiàng)的toString
alert是調(diào)用的toString
2.join方法
在數(shù)組的每一個(gè)項(xiàng)之間,添加join方法傳入的參數(shù)。
var color = ["yellow", "white", "pink",,,,,];
color.join('||')//"yellow||white||pink||||||||"
3.棧方法,會(huì)返回?cái)?shù)組長(zhǎng)度
1.
push方法,在棧的頂部插入
var color = ["yellow", "white", "pink"];
color.push('blue');
color; //["yellow", "white", "pink", "blue"]
2.
pop方法
pop不接受傳值,在棧的頂部彈出
var color = ["yellow", "white", "pink"];
color.pop();
color;//["yellow", "white"];
4.隊(duì)列方法
1.
shift
var color = ["yellow", "blue"];
color.shift();//"yellow"
2.
unshift在我看來(lái),和push的作用是一樣的。
var color = ["yellow", "blue"];
color.unshift('green','black');
color// ["green",'black', "yellow", "blue"]
5.重排序方法
1.
reverse():反轉(zhuǎn)數(shù)組
var color = ["yellow", "blue"];
color.reverse()//["blue", "yellow"]
2.
sort():對(duì)數(shù)組進(jìn)行排序
它是根據(jù)字符串編碼進(jìn)行排序,因此不能直接使用這個(gè)方法。但是它提供了傳入一個(gè)函數(shù)作為參數(shù),便于我們判斷。這個(gè)函數(shù)需要傳入兩個(gè)參數(shù),如果需要反轉(zhuǎn)則返回一個(gè)正數(shù),否則返回一個(gè)負(fù)數(shù)。
var a = [2,6,4,7,3];
undefined
a.sort(function(a,b){
if(a>b){
return 1
}else{
return -1
}
})
a;// [2, 3, 4, 6, 7]
//但是我們往往采用減的方法
a.sort(function(a,b){
return a-b;
})//[2, 3, 4, 6, 7]
6.操作方法
1.
concat方法。基于當(dāng)前數(shù)組,創(chuàng)建一個(gè)新數(shù)組。
在沒(méi)有傳參的情況下,只是復(fù)制當(dāng)前數(shù)組并返回副本。如果傳入是一個(gè)或者多個(gè)數(shù)組,會(huì)把數(shù)組的每一項(xiàng),添加到當(dāng)前數(shù)組的副本。不是數(shù)組,會(huì)簡(jiǎn)單的添加到末尾。
var a = [2,6,4,7,3];
a.concat('2',[1,2,3,[4,5]],{'name':'alen'});
a;//[2, 6, 4, 7, 3, "2", 1, 2, 3, Array(2), {…}]
2.
slice方法?;诋?dāng)前數(shù)組創(chuàng)建一個(gè)或者多個(gè)數(shù)組。接收一個(gè)或者兩個(gè)參數(shù)。當(dāng)傳入一個(gè)參數(shù),表示返回當(dāng)前位置開(kāi)始到最后一個(gè)參數(shù)。傳入兩個(gè)參數(shù),表示返回第一個(gè)參數(shù)到第二個(gè)參數(shù)之間的數(shù)據(jù)。
var a = [2,6,4,7,3];
a.slice(1)//[6, 4, 7, 3]
a.slice(1,4)//[6, 4, 7]
3.
splite()方法??梢圆迦?,刪除,替換等操作。其中可以傳入??梢詡魅攵鄠€(gè)參數(shù)(a,b,c,d,e)a代表開(kāi)始位置,b表示刪除多少項(xiàng),c,d,f表示在a之后插入的參數(shù)
var a = [2,6,4,7,3];
a.splice(1,1)//返回刪除的項(xiàng) 刪除
a// [2, 4, 7, 3];
a.splice(1,0,10,20)//插入
a//[2, 10, 20, 4, 7, 3]
a.splice(1,1,60)//修改
a//[2, 60, 20, 4, 7, 3]
7.位置方法
1.
indexOf()
2.
lastIndexOf()
都可以接收兩個(gè)參數(shù),要查找的項(xiàng)目(必須),起始位置(可選)。使用===操作符
8.迭代方法
1.
every():每一個(gè)返回true則返回true
var a = [2,6,4,7,3];
a.every(function(item,index,array){
return item >= 2
})
//true
2.
filter():返回為true的項(xiàng),組成數(shù)組
3.
forEach():運(yùn)行給定函數(shù),沒(méi)有返回值。
4.
map():調(diào)用結(jié)構(gòu)組成數(shù)組
5.
some():有一個(gè)返回true則返回true
9.歸并方法
1.
reduce():從第一項(xiàng)開(kāi)始迭代
2.
reduceRight():從最后一項(xiàng)開(kāi)始迭代
這兩個(gè)方法都會(huì)迭代數(shù)組的所有項(xiàng),構(gòu)建一個(gè)最終返回值。都接收4個(gè)參數(shù)(a,b,c,d)a表示前一個(gè)值,b表示當(dāng)前值,c表示,項(xiàng)目索引,d表示數(shù)組對(duì)象
var num = a.reduce(function(pre,cur,index,arr){
return pre+cur
})
num//22
3.Date類型
主要掌握獲取年月日的方法??梢宰孕胁樵傾PI
4.RegExp
1.創(chuàng)建方法
pattern:表示匹配的方法
flags:匹配模式包含3種模式:
g:全局匹配,并非在找到一個(gè)后就返回
i:不分大小寫(xiě)模式
m:多行匹配
var expression = / pattern / flags;
var expression = new RexExp(pattern, flags);//注意傳遞的兩個(gè)參數(shù)都是字符串
//eg:匹配所有有at的實(shí)例
var pattern1 = /at/g;
使用正則表達(dá)式字面量和RegExp構(gòu)造函數(shù)創(chuàng)建的正則表達(dá)式不一樣。
在ES3中,正則表達(dá)式的字面量會(huì)共享一個(gè)RexExp實(shí)例。使用構(gòu)造函數(shù),每一次都會(huì)創(chuàng)建一個(gè)實(shí)例。
//eg:
var re = null;
i;
for(i=0; i<10; i++){
re = /cat/g;
re.test('catastrophe');
}
for(i=0; i<10; i++){
re = new RegExp('cat', 'g');
re.test('catastrophe');
}
3.每個(gè)RegExp實(shí)例都有以下屬性
1.
global:是否設(shè)置g標(biāo)值
2.
ignoreCase:是否設(shè)置i標(biāo)值
3.
multiline:是否設(shè)置m標(biāo)值
4.
lastIndex:開(kāi)始搜索的下一個(gè)匹配字符位置。
5.
source:字符串模式
4.RegExp實(shí)例方法
1.
exec():接收要匹配的字符串。返回包含第一個(gè)匹配項(xiàng)信息的數(shù)組,沒(méi)有匹配的情況下返回null。它有額外的兩個(gè)屬性
index:匹配項(xiàng)在字符串中位置
input:應(yīng)用正則表達(dá)式的字符串
//對(duì)于這個(gè)方法而言
//即使在模式中設(shè)置了g標(biāo)志,他每次都只會(huì)返回一個(gè)匹配項(xiàng)
//不設(shè)置全局標(biāo)志的情況下
//在同一個(gè)字符上多次調(diào)用該方法,都只會(huì)返回第一個(gè)匹配項(xiàng)
//設(shè)置了g標(biāo)志
//每次調(diào)用都會(huì)在字符串中繼續(xù)查找新的匹配項(xiàng)。
//eg:
var text = 'cat, bat, sat, fat';
var pattern1 = /.at/;
var match1 = pattern1.exec(text)
console.log(match1[0]);//cat
var match2 = pattern1.exec(text)
console.log(match2[0]);//cat
var pattern2 = /.at/g;
var match3 = pattern2.exec(text)
console.log(match3[0]);//cat
var match4 = pattern2.exec(text)
console.log(match4[0]);//bat
2.
test()
接受一個(gè)字符串作為參數(shù)。有匹配的情況下,返回true,否則返回false。這里對(duì)于上面的/g就不太適用了??赡苁菫g覽器升級(jí)的原因。理論上加上/g不能一直匹配。
還有一點(diǎn)。構(gòu)造函數(shù)形式使用toString()會(huì)轉(zhuǎn)化為字面量形式。
var pattern = new RegExp('\\[bc]\\]at','g')
pattern.toString()//"/\[bc]\]at/g"
掌握到這種程度已經(jīng)夠用了哈!!!
5.Function類型
1.每個(gè)函數(shù)都是Function對(duì)象的實(shí)例。
2.創(chuàng)建函數(shù)的方式
//不能夠在聲明之前使用
var add = function (add1, add2){
return add1+add2;
}
//可以在聲明之前使用
function sum(sum1, sum2){
return sum1+sum2;
}
var sum2 = new Function('sum1', 'sum2', 'return sum1+sum2');//建議不使用這種方法
3.函數(shù)名其實(shí)是一個(gè)指向函數(shù)對(duì)象的指針。不會(huì)與函數(shù)名綁定
function add(add1, add2){
return add1+add2;
}
var sum = add(1,2);
console.log(sum);//3
var add2 = add;
add = null;
var sum2 = add2(3,4);
console.log(sum2);//7
4.在js中沒(méi)有函數(shù)重載,可以函數(shù)重寫(xiě)。后面的函數(shù)會(huì)覆蓋前面的函數(shù)。
5.函數(shù)可以作為參數(shù)或者作為值。因?yàn)楹瘮?shù)名本身就是一個(gè)引用。這個(gè)就涉及到閉包。后面繼續(xù)為大家講解。
6.函數(shù)內(nèi)部屬性
函數(shù)里面有兩個(gè)特殊對(duì)象。
1.
arguments:這是一個(gè)類數(shù)組對(duì)象,保存函數(shù)傳入?yún)?shù)。具有callee屬性。指向當(dāng)前的函數(shù)。
function factorial(a){
if(a<=1){
return 1;
}else{
return a*arguments.callee(a-1);
}
}
factorial(4)//24
2.
this:函數(shù)執(zhí)行的環(huán)境對(duì)象。誰(shuí)調(diào)用就指向的誰(shuí)。其中函數(shù)caller屬性保存this指向的對(duì)象。
arguments.callee.caller//函數(shù)的調(diào)用者。
但是不同的瀏覽器可能可能運(yùn)行結(jié)果不同,容易出錯(cuò)。
并且嚴(yán)格模式下,不能為caller屬性賦值。
7.函數(shù)屬性和方法
1.
length。表示函數(shù)希望接收的參數(shù)。
2.
prototype。屬性不可枚舉。
3.
call()//調(diào)用對(duì)象,參數(shù)1,參數(shù)2,參數(shù)3......
4.
apply()//調(diào)用對(duì)象,數(shù)組參數(shù)。
5.
bind()//創(chuàng)建一個(gè)函數(shù)實(shí)例,this會(huì)綁定到傳給bind()函數(shù)的值
window.color = "red";
var o = {color : "blue"};
function sayColor(){
alert(this.color);
}
var objSayColor = sayColor.bind(o);
objSayColor();//blue
6.基本包裝類型
Boolean,String,Number
這些其實(shí)是基本數(shù)據(jù)類型,但是我們發(fā)現(xiàn)可以使用很多方法。作為基本數(shù)據(jù)類型是沒(méi)有屬性的,更不談?dòng)惺裁捶椒ā5俏覀優(yōu)槭裁茨苁褂眠@些方法呢。因?yàn)樗话b了。
eg
var s1 = "some text";
s1.substring(2)//me text
//其中完成了這樣的過(guò)程
//1.創(chuàng)建一個(gè)String類型的實(shí)例var s1 = new String("some text");
//2.在實(shí)例上調(diào)用這個(gè)方法s1.substring(2)//me text;
//3.銷毀這個(gè)實(shí)例s1 = null;
//當(dāng)然,第二種方法如果不銷毀,會(huì)占用內(nèi)存等問(wèn)題
//但是第一種方法會(huì)自動(dòng)銷毀。所以,建議使用第一種
1.
Boolean
基本包裝類型,使用typeof都是object類型。
注意:我們不建議這樣使用還有一個(gè)原因
var falseObj = new Boolean(false);
var result = falseObj&&true;//true;
//原因,對(duì)象只要不是null,轉(zhuǎn)為bool值都是true。
2.
Number
1.里面包含之前講的一些方法。
2.還有toFixd方法
3.toExponential(n)方法n表示數(shù)字部分的位數(shù)
3.
String
它包含了很多方法
var stringValue = 'hello world';
stringValue.charAt(1);//e
stringValue.charCodeAt(1);//101
stringValue[1]//e
stringValue.concat(',' , 'I love you');//hello world,I love you
stringValue.slice(1,4)//ell
stringValue.substring(1,4)//ell
stringValue.substr(0,4)//ello
stringValue.slice(1)//ello world
stringValue.substring(1)//ello world
stringValue.substr(1)//ello world
//但是對(duì)于負(fù)數(shù)的情況注意
//slice把所有負(fù)數(shù)轉(zhuǎn)為正數(shù),方法:與字符串長(zhǎng)度相加
//substr:第一個(gè)轉(zhuǎn)為正數(shù),第二個(gè)轉(zhuǎn)為0,方法:與字符串長(zhǎng)度相加
//substring:所有負(fù)數(shù)轉(zhuǎn)為0。
stringValue.indexOf('o');//4
stringValue.lastIndexOf('o');//7
stringValue.lastIndexOf('o',6);//4 表示6之后的字符串忽略
stringValue.indexOf('o',5);//7 表示從5之后開(kāi)始查找
var stringValue2 = ' hello world ';
stringValue2.trim();//hello world
stringValue2.toUpperCase()//" HELLO WORLD "
stringValue2.toLowerCase()//" hello world "
//match方法
var stringValue3 = ' hello world ell '
stringValue3.match(/.ell/g);//["hell", " ell"] 有index和lastIndex屬性
//search方法
stringValue3.search(/.ello/g);//4始終從頭開(kāi)始查找
stringValue3.search(/.ello/g);//4
//replace方法
var stringValue4 = 'cat, bat, hat';
stringValue4.replace(/at/g , 'ond');//"cond, bond, hond"
stringValue4.replace(/at/ , 'ond');//"cond, bat, hat"
7.單體內(nèi)置對(duì)象
1.Global對(duì)象
2.Math對(duì)象