1.Object
//聲明對(duì)象1
var person = new Object();
person.name = "Nicholas"
person.age = 29;
//聲明對(duì)象2
var person = {
name : "Nicholas",
age : 29
}
2.Array
value instanceof Array判斷對(duì)象是否為數(shù)組
轉(zhuǎn)換方法demo
var color = ["red","green","blue"]
colors.tostaring(); //red,blue,green
colors.valueof(); //red,blue,green
colors.join(",") //red,blue,green
colors.join("||") //red||blue||green
棧方法demo
var colors = new Array();
var count = colors.push("red","green");
alert(count); //2
count = colors.put("blue");
alert(count); //3
var item = colors.pop(); //獲取最后一項(xiàng)
alter(item); //"blue"
alter(colors.length); //2
隊(duì)列防范demo
var colors = new Array();
var count = colors.push("red","green");
alert(count); //2
var item = colors.shift();
alter(item); //red
alert(colors.length)://2
重排序方法reverse巨坊、sort
//reverse
var values = [1,2,3,4,5];
vaules.reverse();
alert(values); //5,4,3,2,1
//sort()與其他語(yǔ)言的sort方法不同撬槽,相當(dāng)于把數(shù)組中的每個(gè)值都toString后再比較
var values = [0,1,5,10,15];
values.sort();
alert(values); //0,1,10,15,5
//因此需要給sort方法傳入?yún)?shù)
var values = [0,1,5,10,15];
values.sort(compare);
alert(values); //0,1,5,10,15
function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0; }
}
操作方法concat、slice趾撵、splice
var color = ["red","green","blue"];
var color2 = color.concat["yellow",["black","brown"]];
alert(color); //red,green,blue
alert(color2); //red,green,blue,yellow,black,brown
//slice()方法基于當(dāng)前數(shù)組中的一個(gè)或多個(gè)項(xiàng)創(chuàng)建一個(gè)新的數(shù)組侄柔,入?yún)槲恢?var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors2); //green,blue,yellow,purple
alert(colors3); //green,blue,yellow
//splice()
- 刪除splice(0,2)可以刪除數(shù)組中的前兩項(xiàng)
- 插入splice(2,0,"red","green"),起始位置占调、要?jiǎng)h除的個(gè)數(shù)暂题、插入的元素
- 替換splice(2,1,"red","green")
var color = ["red","green","blue"];
var removed = colors.splice(0,1);
alert(color); //green,blue
alert(removed); //red,返回的數(shù)組中只包含一項(xiàng)
removed = color.splice(1,0,"yellow","orange");
alert(color); //green,yellow,orange,blue
alert(removed); //返回為空
removed = colors.splice(1,1,"red","purple");
alert(color); //green,red,purple,orange,blue
alert(removed); //yellow
位置方法
var num = [1,2,3,4,5,4,3,2,1];
alert(num.indexOf(4)); //3
alert(num.lastInedxOf(4)); //5
alert(num.indexOf(4,4)); //5
alert(number.lastIndexOf(4,4)); //3
var person = {name : "Nicholas"};
var people = [{name : "Nicholas"}];
var morePeople = [person];
alert(people.indexof(person)); //-1
alert(morePeople.indexOf(person)); //0
迭代方法(以下方法都不會(huì)修改數(shù)組的值)
- every()對(duì)數(shù)組每個(gè)值執(zhí)行一個(gè)函數(shù),如果所有函數(shù)執(zhí)行結(jié)果都是true究珊,最后返回true(and)
- some()對(duì)數(shù)組每個(gè)值執(zhí)行一個(gè)函數(shù)薪者,如果有一個(gè)函數(shù)執(zhí)行為true,最后返回true(or)
- filter()對(duì)數(shù)組每個(gè)值執(zhí)行一個(gè)函數(shù)剿涮,返回執(zhí)行結(jié)果為true的數(shù)組
- forEach()對(duì)數(shù)組每個(gè)值執(zhí)行一個(gè)函數(shù)啸胧。無(wú)返回值
- map()對(duì)數(shù)組每個(gè)值執(zhí)行一個(gè)函數(shù),每個(gè)函數(shù)的結(jié)果組成數(shù)組
var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.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
var filterResult = numbers.some(function(item,index,array){
return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]
var mapResult = numbers.map(function(item,index,array){
return (item * 2);
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]
歸并方法 reduce幔虏、reduceRight
注:reduceRight()與reduce()結(jié)果一樣纺念,但是執(zhí)行順序相反
//reduce
var values = [1,2,3,4,5]
var sum = values.reduce(function(prev,cur,index,array){
return perv + cur;
});
alert(sum); //15
//reduceRight
var values = [1,2,3,4,5]
var sum = values.reduceRight(function(prev,cur,index,array){
return perv + cur;
});
alert(sum); //15
3.Date類型
var now = new Date();
//創(chuàng)建一個(gè)2004年5月25日的日期對(duì)象
var someDate = new Date(Date.parse("May 25, 2004"));
//GMT時(shí)間2005年5月5日下午5:55:55
var allFives = new Date(Date.UTC(2005, 5, 5, 17, 55, 55));
var allFives1 = new Date(2005, 4, 5, 17, 55, 55);
繼承的方法
var date1 = new Date(2007,0,1); //"January 1, 2007"
var date2 = new Date(2007,1,1); //"February 1, 2007"
alert(date1 < date2); //true
alert(date1 > date2); //false
日期格式化方法
- toDateString()--以特定的格式展示星期、月想括、日陷谱、年
- toTimeString()--以特定的格式展示時(shí)、分瑟蜈、秒烟逊、時(shí)區(qū)
- toLocaleDateString()--以特定的地區(qū)展示星期、月铺根、日宪躯、年
- toLocaleTimestiring()--以格式展示時(shí)、分位迂、秒
- toUTCString()--以特定的格式展示完成的UTC日期
日期访雪、時(shí)間組件方法
- getTime()
- setTime()
- getFullYear()
- getUTCFullYear()
- setFullYear()
- setUTCFullYear()
- getMonth()
- getUTCMonth()
- setMonth()
- setUTCMonth()
- getDate()
- getUTCDate()
- setDate()
- setUTCDate()
- getDay() --返回日期是星期幾
- getUTCDay() --返回UTC中日期是星期幾
- getHours()
- getUTCHours()
- setUTCHours()
- getMinutes()
- getUTCMinutes()
- setMinutes()
- setUTCMinutes()
- getSeconds()
- getUTCSeconds()
- setSeconds()
- setUTCSeconds()
- getMilliseconds()
- getUTCMilliseconds()
- setMilliseconds()
- setUTCMilliseconds
- getTimezoneOffset()
4.RegExp
- g:表示全局模式
- i:表示不區(qū)分大小寫
- m:表示多行
//字符串中所有包含“at”的
var pattern1 = /at/g;
//匹配到第一個(gè)"bat"、"cat"掂林,不區(qū)分大小寫
var pattern2 = /[bc]at/i;
//所有以“at”結(jié)尾的3個(gè)字符的組合臣缀,不區(qū)分大小寫
var pattern3 = /.at/gi;
//第一個(gè)[bc]at,不區(qū)分大小寫
var pattern2 = /\[bc\]at/i;
RegExp實(shí)例屬性
RegExp的每個(gè)實(shí)例都有以下屬性
- global:是否設(shè)置了g標(biāo)志泻帮,boolean
- ignoreCase:是否設(shè)置了i標(biāo)志精置,boolean
- lastIndex:從開始搜索下一個(gè)匹配項(xiàng)字符串位置,從0開始算
- multiline:是否設(shè)置了m標(biāo)志锣杂,boolean
- source:
var pattern1 = /\[bc\]at/i;
alert(pattern1.global); //false
alert(pattern1.ignoreCase); //true
alert(pattern1.multiline); //false
alert(pattern1.lastIndex); //0
alert(pattern1.source); //"\[bc\]at"
RegExp實(shí)例方法
var text = "mom adn dad and bady";
var pattern = /mom( and dad( and baby)?)?/gi;
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"
5.Function類型 function經(jīng)常用不解釋
沒(méi)有重載
//result會(huì)調(diào)用最近的方法執(zhí)行
function addSomeNumber(num){
return num + 100;
}
function addSomeNumber(num){
return num + 200
}
var result = addSomeNumber(100); //300
函數(shù)聲明與函數(shù)表達(dá)式
//解析器會(huì)先讀取函數(shù)聲明脂倦,并使其在執(zhí)行任何代碼之前可以被使用函數(shù)表達(dá)式番宁,則必須等到解析器執(zhí)行到它所在的代碼行,才會(huì)被解析
//1.解析器先通過(guò)函數(shù)聲明提升過(guò)程赖阻,讀取函數(shù)聲明并添加到環(huán)境中
//2.對(duì)代碼求值是蝶押,js引擎也能把函數(shù)聲明提升到頂部
alert(sum(10,10));
function sum(num1,num2){
return num1+num2;
}
//以上代碼會(huì)在運(yùn)行期間報(bào)錯(cuò),函數(shù)位于一個(gè)初始化語(yǔ)句中政供,所以當(dāng)sum加載的時(shí)候找不到function
alert(sum(10,10));
var sum = function sum(num1,num2){
return num1+num2;
};
值函數(shù):
//可以將一個(gè)函數(shù)作為另一個(gè)函數(shù)的結(jié)果返回
function callSomeFunction(someFunction, someArgumert){
return someFunction(someArgument);
}
function add10(num){
return num + 10;
}
var result1 = callSomeFunction(add10,10);
alert(result1); //20
function getGreeting(name){
return "hello," +name;
}
var result2 = callSomeFunction(getGreeting, "Nicholas")
alert(result2); //"hello,Nicholas"
適用場(chǎng)景
例如播聪,一個(gè)對(duì)象數(shù)組朽基,需要根據(jù)某個(gè)對(duì)象屬性對(duì)數(shù)組進(jìn)行排序布隔,而傳遞給數(shù)組sort()方法
比較函數(shù)只能接受兩個(gè)參數(shù)。下面做一下嘗試:
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;
}
};
}
//調(diào)用上面的方法稼虎,這個(gè)方法絕對(duì)經(jīng)典
var data = [{name: "Zachary", age:28}, {name: "Nicholas", age: 29}];
data.sort(creatComparisonFunction("name"));
alert(data[0].name); //Nicolas
data.sort(creatComparisonFunction("age"));
alert(data[0].name); //Zachary
函數(shù)內(nèi)部屬性
函數(shù)內(nèi)部有兩個(gè)特殊對(duì)象:arguments和this
arguments demo:為了消除與方法名之間的耦合衅檀,可以用arguments.callee的方式
無(wú)論方法名稱怎么改變,內(nèi)部的調(diào)用無(wú)需更改霎俩。
//正常遞歸
function factorial(num){
if (num <=1){
return 1;
} else {
return num * factoral(num -1)
}
}
//arguments遞歸
function factorial(num){
if (num <= 1){
return 1;
} else {
return num * arguments.callee(num-1)
}
}
this哀军,行為與java類似
window.color = "red";
var o = {color : "blue"};
function sayColor(){
alert(this.color);
}
syaColor(); //"red"
o.sayColor = sayColor;
o.sayColor(); //"blue"
解釋一下:
上面函數(shù)sayColor()是在全局作用域中定義的,它引用了this對(duì)象打却,這里this引用了全局對(duì)象windwo杉适。
當(dāng)把這個(gè)函數(shù)賦值給對(duì)象o,調(diào)用o.sayColor()柳击,this引用的是對(duì)象o猿推,所以結(jié)果是blue。
函數(shù)屬性和方法
每個(gè)函數(shù)都包含兩個(gè)屬性:length和prototype
length表示函數(shù)希望接受命名參數(shù)的個(gè)數(shù)
function sayName(){
alert(name);
}
function sum(num1, num2){
return num1 + num 2;
}
function sayHi(){
alert("hi");
}
alert(sayName.length); //1
alert(sum.length); //2
alert(sayHi.length); //0
prototype是保存所有實(shí)例方法的本質(zhì):apply()和call()
apply()demo
//apply方法可以傳入運(yùn)行函數(shù)作用域捌肴,另一個(gè)是數(shù)組(也可以是arguments對(duì)象)
function sum(num1, num2){
return num1 + num2;
}
function callSum1(num1, num2){
return sum.apply(this, arguments);
}
function callSum2(num1, num2){
retunr sum.apply(this, [num1, num2]);
}
alert(callSum1(10,10)); //20
alert(callSum2(10,10)); //20
call()demo蹬叭,在使用callSum()的時(shí)候必須準(zhǔn)去傳入每一個(gè)參數(shù)
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
這次saycolor作為全局變量,所以直接執(zhí)行方法是全局的color
sayColor.call(this)與sayColor.call(window)則是在全局作用域中調(diào)用函數(shù)的方式状知,結(jié)果是red
sayColor().call(o)時(shí)執(zhí)行的對(duì)象變成了o秽五,所以結(jié)果是blue。
bind() demo饥悴,相當(dāng)于sayColor被綁定了
window.color = "red";
var o = {color : "blue"};
function sayColor(){
alert(this.color);
}
var objectSayColor = sayColor.bind(o);
bijectSayColor(); //blue
6.基本包裝類型
為了方便操作基本類型坦喘,三個(gè)特殊引用類型:Boolean、Number西设、String
\\new Object
var obj = new Object("some text");
alert(obj instanceof String); //true
轉(zhuǎn)型構(gòu)造函數(shù)
\\構(gòu)造函數(shù)
var value = "25";
var number = Number(value); //轉(zhuǎn)型函數(shù)
alert(typeof number); //Number
var obj = new Number(value);//構(gòu)造函數(shù)
alert(typeof obj); //Object
boolean類型
var falseObject = new Boolean(false);
var result = falseObject && true;
alert(result); //true
var falseObject = false;
result = false && true;
alert(result); //false
falseObject && true這段代碼針對(duì)的是falseObject這個(gè)對(duì)象
Number類型
//把num轉(zhuǎn)換成對(duì)應(yīng)的二進(jìn)制...
var num = 10;
alert(num.toString()); //10
alert(num.toString(2)); //1010
alert(num.toString(8)); //12
alert(num.toString(10)); //10
alert(num.toString(16)); //a
Number的格式化方法
//toFixed轉(zhuǎn)換成小數(shù)
var num = 10;
alert(num.toFixed(2)); //10.00
//toFixed約等于
var num1 = 10.005;
alert(num1.toFixed(2)); //"10.01"
//toExponential
var num = 10;
alert(num.toExponential(1)); //"1.0e+1"
關(guān)于Number的轉(zhuǎn)型
var numberObject = new Number(10);
var numberValue = 10;
alert(typeof numberObject); //"object"
alert(typeof numberValue); //"number"
alert(numberObject instanceof Number); //true
alert(numberValue instanceof Number); //false
String類型
length屬性
var stringValue = "Hello world";
alert(stingValue.length); //11
字符方法
//chatAt
var stringValue = "hello world";
alert(stringValue.charAt(1)); //"e"
//charCodeAt:輸出字母對(duì)應(yīng)的字符編碼
alert(stringValue.charCodeAt(1)); //"101"
//stringValue[index]
alert(stringValue[1]) //"e"
字符串操作方法
//concat()
var stringValue = "hello world";
var result = stringValue.concat("world","!");
alert(result);
alert(stringValue);
//slice()
alert(stringValue.slice(3)); //lo world
alert(stringValue.slice(3, 7)); //lo w
alert(stringValue.slice(-3)); //rld
alert(stringValue.slice(3, -4)); //"lo w"
//substr()
alert(stringValue.substr(3)); //lo world
alert(stringValue.substr(3, 7)); //lo worl
alert(stringValue.substr(-3)); //"rld"
alert(stringValue.substr(3, -4)); //""空字符串
//sbustring()
alert(stringValue.substring(3)) //lo world
alert(stringValue.substring(3,7)); //lo w
alert(stringValue.substring(-3)); //hello world
alert(stringValue.substring(3, -4));//"hel"
字符串位置方法
var stringValue = "hello world";
//indexof
alert(stringValue.indexOf("o")); //4
alert(stringValue.indexOf("o", 6)); //7
//lastIndexOf
alert(stringValue.lastIndexOf("o")); //7
alert(stringValue.lastIndexOf("o", 6)); //4
通過(guò)循環(huán)調(diào)用indexof()或lastIndexOf()來(lái)找到所有匹配的子字符串
var strinValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit";
var positions = new Array();
var pos = stringValue.indexOf("e");
while(pos > -1){
positions.push(pos);
pos = stringValue.indexOf("e", pos +1);
}
alert(positions); //"3,24,32,35,52"
trim()方法
var stringValue = " hello world ";
var trimmedStringValue = stringValue.trim();
alert(trimmedStringValue) //"hello world"
字符串大小寫轉(zhuǎn)換方法
var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase()); //"HELLO WORLD"
alert(stringValue.toUpperCase()); //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase()); //"hello world"
alert(stringValue.toLowerCase()); //"hello world"
字符串的模式匹配方法
//match方法返回一個(gè)數(shù)組
var text = "cat, bat, sat, fat";
var pattern = /.at/;
// 與pattern.exec(text)相同
var matches = text.match(pattern);
alert(matches.index); //0
alert(matches[0]); //"cat"
alert(pattern.lastIndex); //0
search()demo
var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos); //1
replace
var text = "cat, bat, sat, fat";
var result = text.rep;ace("at", "ond")
alert(result); //"cond, bat, sat, fat"
result = text.replace(/at/g, "ond");
alert(result); //"cond, bond, sond, fond"
localeCompare
//字符串比較大小
var stringValue = "yellow";
alert(stringValue.localeCompare("brick")); //1 alert(stringValue.localeCompare("yellow")); //0 alert(stringValue.localeCompare("zoo")); //-1
fromCharCode
把字符編碼轉(zhuǎn)換成字符
alert(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"
7.單體內(nèi)置對(duì)象
Global對(duì)象(全局對(duì)象)
URI編碼方法
var uri = "http://www.wrox.com/illegal value.htm#start";
//"http://www.wrox.com/illegal%20value.htm#start"
alert(encodeURI(uri));
//"http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start"
alert(encodeURIComponent(uri));
eval()方法:相當(dāng)于一個(gè)完成的js解析器
eval("alert('hi')");
//相當(dāng)于
alert("hi");
Global對(duì)象屬性
- undefined
- NaN
- Infinity
- Object
- Array
- Function
- Boolean
- String
- Number
- Date
- RagExp
- Error
- EcalError
- RangeEror
- EvalError
- RangeError
- ReferenceError
- SyntaxError
- TypeError
- URIError
Math對(duì)象
var max = Math.max(3, 54, 32, 16)
alert(max); //54
var min = Math.min(3, 54, 32, 16);
alert(min); //3
舍入方法
alert(Math.ceil(25.9)); //26
alert(Math.ceil(25.5)); //26
alert(Math.ceil(25.1)); //26
alert(Math.round(25.9)); //26
alert(Math.round(25.5)); //26
alert(Math.round(25.1)); //25
alert(Math.floor(25.9)); //25
alert(Math.floor(25.5)); //25
alert(Math.floor(25.1)); //25
random()方法
//1到10隨機(jī)數(shù)
var num = Math.floor(Math.random() * 9 + 2);
以上內(nèi)容引用于《JavaScript高級(jí)程序設(shè)計(jì)(第三版)作者:Nicholas C.Zakas》