DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript原生對象常用方法總結(推薦)
JavaScript原生對象常用方法總結(推薦)
編輯:關於JavaScript     

下面都是我學習W3C School教程中有關JavaScript寫的學習筆記,每個方法我都親身測試過,每個方法的用途和參數列表,我都是在經過我親身實踐後加上了我自己的一點理解,解釋的還算比較詳細。現記錄下來,以便查閱:

javascript之Array類:

創建js數組兩種方式:

var arr = [];  或
var arr = new Array();

()裡可以指定長度,也可以不指定,指不指定都無所謂,

因為js裡的數組長度是可變的

concat(arr1,arr2,arr3......arrx):js數組合並,返回合並後的新數組,至少需要傳遞一個數組,也可以傳遞多個數組

 

var arr1 = new Array(3); 

arr1[0] = "George"; 

arr1[1] = "John"; 

arr1[2] = "Thomas"; 

arr1[3] = "Jeery"; 



var arr2 = new Array(3); 

arr2[0] = "James"; 

arr2[1] = "Adrew"; 

arr2[2] = "Martin"; 



var arr3 = new Array(3); 

arr3[0] = "Java"; 

arr3[1] = "C#"; 

arr3[2] = "PHP"; 



var arr4 = arr1.concat(arr2,arr3); 

alert(arr4); 

 join(): 將數組元素按指定的分隔符拼接成一字符串返回,默認分隔符為英文逗號

var arr = new Array(3) 

arr[0] = "George"; 

arr[1] = "John"; 

arr[2] = "Thomas"; 

arr[3] = "Jeery"; 

arr.join("."); 

sort(fn): 數組排序,默認是按英文字母的ASC碼升序排列,比如apple排在orange前面,其實

sort還可以接收一個參數,該參數function類型,有點類似於java裡的比較器的意思,

就是說如果不想按默認的比較規則來排序,就必須提供一比較函數,該函數有兩個參數a、b,

如果返回值小於0,則a排在b前面

如果返回值大於0,則b排在a前面

如果返回值等於0,則a、b位置不變

var arr = new Array(6); 

arr[0] = 5; 

arr[1] = 23; 

arr[2] = 4; 

arr[3] = 18; 

arr[4] = 88; 

arr[5] = 10; 

arr.sort(sortNumber); 



function sortNumber(a, b) 

{ 

return a - b; 

} 

pop():刪除數組的最後一個元素,把數組長度減 1,並且返回它刪除的元素的值。

如果數組已經為空,則 pop() 不改變數組,並返回 undefined 值。

var arr = new Array(6); 

arr[0] = 5; 

arr[1] = 23; 

arr[2] = 4; 

arr[3] = 18; 

arr[4] = 88; 

arr[5] = 10; 



var a = arr.pop(); 

alert(a); 

for(var x in arr){ 

alert(arr[x]); 

} 

push(n1,n2,n3,....nx):向數組末尾添加一個或多個元素,並返回添加後數組的長度,

注意,此方法操作的是原數組對象,不會創建副本。此方法可以接收多個參數,

至少要傳遞一個參數

var arr = new Array(6); 

arr[0] = 5; 

arr[1] = 23; 

arr[2] = 4; 

arr[3] = 18; 

arr[4] = 88; 

arr[5] = 10; 



var len = arr.push(44,80); 

alert(len); 

for(var x in arr){ 

alert(arr[x]); 

} 

reverse(): 顛倒數組中元素的順序,即如果原來數組元素是1,2,3,4,5,調用reverse()後,

元素順序為5,4,3,2,1,注意,此方法直接操作的是原數組對象,不會創建副本。

var arr = [3,5,11,6,90,0]; 

arr.reverse(); 

for(var x in arr){ 

alert(arr[x]); 

} 

shift(): 刪除數組的第一個元素,並返回它刪除的那個元素

如果數組已經為空,則 shift() 不改變數組,並返回 undefined 值

注意,此方法直接操作的是原數組,不會創建副本對象

var arr = [3,5,11,6,90,0]; 

var a = arr.shift(); 

alert(a); 

for(var x in arr){ 

alert(arr[x]); 

}

slice(start,end): 用於截取start和end之間的數組元素並存入新數組返回
                 注意,此方法不會修改原數組,會創建數組副本對象。

如果end未指定,則表示直接從start直到數組末尾,

如果start或end為負數,表示從後面開始算起,比如

-1,表示從倒數第一個元素算起,以此類推。

截取的區間范圍是[start,end),前閉後開區間,且start必須小於end

如果沒找到一個元素,則返回一個空數組即數組的長度為0

 

var arr = [3,5,11,6,90,0]; 

var a = arr.slice(2,4); 

alert(a.join()); 

splice(index,howmany,element1,.....,elementX): 

 用於刪除從 index 處開始的零個或多個元素,並且用參數列表中聲明的一個或

多個值來替換那些被刪除的元素,並返回剛剛刪除的元素組成的新數組。

注意:此方法是直接操作的原數組對象,不會創建對象副本

第一個參數:表示從index位置開始刪除,index從零開始計算

第二個參數:表示從index位置開始,往後連續刪除幾個元素,前兩個參數是必需的,後面的參數是可選的。

後面的參數是用添加的元素,添加的元素從index處開始添加,如果後面添加的元素個數大於

實際刪除的元素個數,多出幾個,後面的元素就往後移動幾位。比如你實際刪除了4個元素,

而實際你後面添加了6個元素,那最終會從index處開始添加6個元素,由於前面只刪除4個元素,

位置不夠,所以後面的元素會自動往後移動2位。

var arr = [3,5,11,6,90,0,15,57,70,20]; 

var a = arr.splice(0,4,1,2,3,4,5,6); 

alert(a); 

for(var x in arr){ 

alert(arr[x]); 

} 

unshift(element1,.....,element):

向數組開頭添加一個或多個元素,並返回添加後的數組長度。至少要傳一個參數。

注意此方法是直接操作原數組,最後添加的元素index=0,以此類推。

var arr = [3,5,11,6,90,0,15,57,70,20]; 

arr.unshift(22,23,24); 

alert(arr.toString()); 

alert(arr.length); 



擴展Array的函數:

 

Array.prototype.indexOf = function(o){ 

for(var i = 0,len=this.length; i<len;i++){ 

if(this[i] == o){ 

return i; 

} 

} 

return -1; 

} 

Array.prototype.remove = function(o){ 

var index = this.indexOf(o); 

if(index != -1){ 

this.splice(index,1); 

} 

return this; 

} 

var arr = [3,5,11,6,90,0,15,57,70,20]; 

arr.remove(90); 

alert(arr.toString()); 

alert(arr.length); 

 js中Number類常用方法:

toFixed(): 將數字四捨五入為指定小數位數的數字,參數值范圍為[0,20],表示四捨五入後保留的小數位數,
          如果沒有傳入參數,默認參數值等於0

var num = 12.5563; 

alert(num.toFixed()); 

alert(num.toFixed(2)); 

toprecision(): 用於將數字精確到指定長度,方法接收參數一個參數,參數的范圍為[0,21]

參數表示數字的位數,如果數字總位數大於參數值且數字是小數,那麼會進行

四捨五入,如果數字總位數小於參數值且數字是小數,那麼多出的小數位會自動補零

如果數字總位數小於參數值且數字為整數,那麼會改用科學計數法表示。

var num1 = 100009; 

var num2 = 100; 

var num3 = 11111111.00009; 

var num4 = 1.00609; 

alert(num1.toPrecision(5)); 

alert(num2.toPrecision(5)); 

alert(num3.toPrecision(15)); 

alert(num4.toPrecision(3)); 

isNaN(num):判斷是否為數字,這個方法很有用

js中String類常用方法:

charAt(index):用於返回指定位置的字符,index從0開始計算

charCodeAt(index):用於返回指定字符的ASCII碼

concat(element1,element2......elementx):用於拼接兩個或多個字符串

indexOf():用於返回指定字符在字符串中第一次出現的索引,從第一個字符開始查找,找到立即返回。

lastIndexOf():用於返回指定字符在字符串中第一次出現的索引,不過是從最後面一個字符開始查找。

match():用於檢索與指定正則匹配的子串,如果開啟了全局檢索模式,且有多個符合條件的子串,那麼

返回的是一個數組。

var str = "hello world! how are you? what are you doing?"; 

var arr = str.match(/you/g); 

alert(arr); 

var str="1 plus 2 equal 3" 

alert(str.match(/\d\s/g)); 



replace():用於字符串替換操作,接收兩個參數。

第一個參數:表示待替換的字符串,或者是替換的正則表達式

第二個參數:替換文本,也可以是一個function的返回值

注意此方法不會改變原字符串對象,而是返回新字符串對象。

var str = "I like Java,Java is so easy to learning!Let's together for Java"; 

var test = str.replace(/Java/g,"Javascript"); 

alert(str); 

alert(test); 



var name = "Doe , John"; 

alert(name.replace(/(\w+)\s*, \s*(\w+)/, "$2 | $1")); 



var name = "I like java,java is so easy!"; 

var test = name.replace(/java/g, function(m,i){alert(m);alert(i);return "javascript";}); 

alert(test); 

用function返回值作為替換文本時,function裡有兩個參數:

m表示前面第一個參數即正則匹配到的子串,第二個參數是該子串在原字符串中的索引位置

search():用於返回指定子串或符合指定正則表達式的子串在原字符串中第一次出現的索引,

如果沒有找到,則返回-1

var str = "I like javascript.";
alert(str.search("javascript"));
 
slice(start,end):用於截取start,end指定區間內的字符串並返回,

此方法不會操作原字符串對象數據,而是創建字符串副本保存截取後的字符串數據

如果end未指定,則表示直接從start直到數組末尾,

如果start或end為負數,表示從後面開始算起,比如

-1,表示從倒數第一個元素算起,以此類推。

截取的區間范圍是[start,end),前閉後開區間,且start必須小於end

如果沒找到一個元素,則返回一個空字符串

var str = "hello world!"; 

var test = str.slice(-2,-1); 

alert(test); 

alert(str); 

split():以指定的分割字符或正則表達式的匹配字符來分割原字符串,返回結果以數組形式表示。

此方法還可以接收第二個參數,第二個參數可以限制最終返回的數組元素最大個數。

var str="How are you doing today?"

alert(str.split(/\s/));
 
substr():用於字符串截取,方法接收兩個參數,

第一個參數start,表示從start索引位置開始截取,索引從0開始計算,如果此參數值是負數,

則會從字符串結尾開始計算,比如-1表示最後一個字符,-2表示倒數第二個字符,以此類推。

第二個參數length,表示截取的字符串長度,此參數為可選,如不指定此參數,

則默認會一直截取到字符串結尾。

注意:此方法已不建議使用

var str = "I like javascript!";
alert(str.substr(7,10));
 
substring():用於截取start與end索引區間內的字符串,區間范圍為[start,end],前閉後開

注意:參數start和end必須為非負整數,

如start為負數,則默認會將start賦值為0,

如end為負數,則默認會將end賦值為0,且截取區間改為[0,start)。

如果start大於end,那麼會首先交換兩個參數值的位置,即區間改為[end,start)

var str1 = "I like javascript!": 

alert(str1.substring(7,18)); 

var str2 = "I like javascript!"; 

alert(str2.substring(3,-3)); 



toLowerCase():把字符串轉換成小寫
 
toUpperCase():把字符串轉換成大寫
 
 
 
 
 
js中Date對象常用方法:
Date():此方法為Date類的構造函數,此方法接收日期格式字符串,
       若不給構造函數傳參,則默認是取系統當前時間
       構造函數可以接收一個距1970-01-01的毫秒數來構建Date對象,
       也可以接收規定格式的日期字符串來構建Date對象
           //var date = new Date("06 05,1987"); //火狐OK IE不OK
  //var date = new Date("6 5,1987");   //火狐OK IE不OK
  //var date = new Date("06 05,1987 23:12:33"); //火狐OK IE不OK
  //var date = new Date("6 5,1987 23:12:33");   //火狐OK IE不OK
  //var date = new Date("1987,06 05"); //火狐OK IE不OK
  //var date = new Date("1987,6 5"); //火狐OK IE不OK
  //var date = new Date("1987,06,05"); //火狐OK IE不OK
  //var date = new Date("1987,6,5"); //火狐OK IE不OK
  //var date = new Date("1987,06 05,23:12:33"); //火狐OK IE不OK
  //var date = new Date("1987,6 5,23:12:33"); //火狐OK IE不OK
  //var date = new Date("1987,06,05,23:12:33"); //火狐OK IE不OK
  //var date = new Date("1987,6,5,23:12:33"); //火狐OK IE不OK
           //var date = new Date("1987/6/5,23:12:33"); //火狐和IE都OK
  //var date = new Date("1987/06/05,23:12:33"); //火狐和IE都OK
  //var date = new Date("06/05/1987,23:12:33"); //火狐和IE都OK
  //var date = new Date("6/5/1987,23:12:33"); //火狐和IE都OK
  //var date = new Date("1987/6/5"); //火狐和IE都OK
  //var date = new Date("1987/06/05"); //火狐和IE都OK
  //var date = new Date("06/05/1987"); //火狐和IE都OK
  var date = new Date("6/5/1987"); //火狐和IE都OK
           //var date = new Date("06-05-1987"); //IE OK,火狐不OK
  //var date = new Date("6-5-1987"); //IE OK,火狐不OK
  //var date = new Date("1987-06-05"); //火狐OK,IE不OK
           alert(date);
      通過上面這些示例,足以說明,如果Date()構造函數需要接收一個日期格式字符串的話,
      那麼字符串格式應如下給定:
      yyyy/m/d
      yyyy/MM/d
      yyyy/m/d HH:mm:ss
      yyyy/MM/d HH:mm:ss
      m/d/yyyy
      MM/dd/yyyy
      m/d/yyyy HH:mm:ss
      MM/dd/yyyy HH:mm:ss
    
getDate():返回一個月中的某一天,返回值范圍:1-31
getDay():返回一周中的第幾天也就是星期幾,返回值范圍:0-6,0表示星期天,6表示星期六
getMonth():返回日期中的月份數字,返回值范圍:0-11,0表示1月,11表示12月,這個有點變態
getFullYear():返回日期中的年份數字,用4位數字表示而不是2位數字的縮寫形式
getHours():返回小時數,返回值范圍:0-23
getMinutes():返回分鐘數:返回值范圍:0 -59
getSeconds():返回秒數,返回值范圍:0-59
getMilliseconds():返回毫秒數,返回值范圍:0-999,這個方法命名我表示不能理解,為何Seconds首字母不大寫?
getTime():返回指定的日期距1970年1月 1日00:00:00之間的毫秒數。
parse(): 用於將符合規定的日期字符串轉換成日期,並返回該日期至1970-01-01的毫秒數

注意:此方法是靜態方法,不用能用Date對象調用,而應該使用Date類調用。
//var date = Date.parse("1987-06-05"); //火狐OK,IE不OK
//var date = Date.parse("06-05-1987"); //IE OK,火狐不OK
//var date = Date.parse("06/05/1987"); //IE和火狐都OK
var date = Date.parse("1987/06/05");   //IE和火狐都OK
//var date = Date.parse("6/5/1987"); //IE和火狐都OK
//var date = Date.parse("1987/6/5");   //IE和火狐都OK
//var date = Date.parse("1987/06/05 23:12:22");   //IE和火狐都OK
//var date = Date.parse("6/5/1987 23:12:22"); //IE和火狐都OK
//var date = Date.parse("1987/6/5 23:12:22");   //IE和火狐都OK

alert(date);
通過上面的這些示例,不難看出,parse方法接收的日期字符串格式比較兼容的格式為:

yyyy/MM/dd
yyyy/m/d
MM/dd/yyyy
M/d/yyyy
yyyy/MM/dd HH:mm:ss
yyyy/m/d HH:mm:ss
MM/dd/yyyy HH:mm:ss
M/d/yyyy HH:mm:ss
 
setDate():設置一個月中的某一天,取值范圍:1-31
setDay():設置一周中的第幾天也就是星期幾,取值范圍:0-6,0表示星期天,6表示星期六
setMonth():設置日期中的月份數字,取值范圍:0-11,0表示1月,11表示12月,這個有點變態
setFullYear():設置日期中的年份數字,用4位數字表示而不是2位數字的縮寫形式
setHours():設置小時數,取值范圍:0-23
setMinutes():設置分鐘數:取值范圍:0 -59
setSeconds():設置秒數,取值范圍:0-59
setMilliseconds():設置毫秒數,取值范圍:0-999,這個方法命名我表示不能理解,為何Seconds首字母不大寫?
setTime():設置指定的日期距1970年1月 1日00:00:00之間的毫秒數。
 
toString():將Date對象轉換成字符串形式,默認是格林威治標准時間格式即GMT格式
toTimeString():將Date對象的時間部分轉成字符串形式,GMT格式
toDateString():將Date對象的日期部分轉成字符串形式,GMT格式
toLocaleString:根據本地語言的日期規則表示,中文下是yyyy年MM月dd日 hh:mm:ss
Date.UTC(year,month,day,hours,minutes,seconds,ms):

此方法用於根據世界時返回距離1970-01-01的毫秒數,前3個參數是必須的,其余參數是可選的,
分別表示年、月、日、小時、分鐘、秒、毫秒,
此方法返回的毫秒數可以傳遞給Date()構造函數,
           
Date對象的toString方法默認是轉換成GMT格式,對於我們來說,不適用,我們往往希望顯示為yyyy-MM-dd hh:mm:ss格式,
Date原生對象沒有提供這個功能,只好自己擴展了,

Date.prototype.format = function(format){ 

var o = { 

"M+" : this.getMonth()+1, //month 月 

"d+" : this.getDate(), //day 日 

"h+" : this.getHours(), //hour 時 

"m+" : this.getMinutes(), //minute 分 

"s+" : this.getSeconds(), //second 秒 

"q+" : Math.floor((this.getMonth()+3)/3), //quarter季度 

"S" : this.getMilliseconds() //millisecond毫秒 

} 



if(/(y+)/.test(format)) { 

format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length)); 

} 



for(var k in o) { 

if(new RegExp("("+ k +")").test(format)) { 

format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length)); 

} 

} 

return format; 

} 



使用示例:

var date = new Date(); 

alert(date.format("yyyy-MM-dd hh:mm:ss")); 

js的原生Date類也沒有提供add方法即在原日期基礎先添加或減去指定天數,現擴展如下:

Date.prototype.dateAdd = function(interval,number) 

{ 

var d = this; 

var k={'y':'FullYear', 'q':'Month', 'm':'Month', 'w':'Date', 'd':'Date', 'h':'Hours', 'n':'Minutes', 's':'Seconds', 'ms':'MilliSeconds'}; 

var n={'q':3, 'w':7}; 

eval('d.set'+k[interval]+'(d.get'+k[interval]+'()+'+((n[interval]||1)*number)+')'); 

return d; 

} 



interval參數:
y       年
q       季度
m       月
d       日
w       周
h       小時
n       分鐘
s       秒
ms      毫秒
 
number參數:時間間隔,必須為數字,為正數表示獲取指定間隔的未來的日期,為負數表示過去的日期
 
//用於計算兩個日期之間的時間間隔,
//使用此方法還能比較兩個日期的大小,如果返回值大於0,表示objDate2比較大,
//如果小於0,表示objDate2比較小

Date.prototype.dateDiff = function(interval,objDate2)
{
 var d=this, i={}, t=d.getTime(), t2=objDate2.getTime();
 i['y']=objDate2.getFullYear()-d.getFullYear();
 i['q']=i['y']*4+Math.floor(objDate2.getMonth()/4)-Math.floor(d.getMonth()/4);
 i['m']=i['y']*12+objDate2.getMonth()-d.getMonth();
 i['ms']=objDate2.getTime()-d.getTime();
 i['w']=Math.floor((t2+345600000)/(604800000))-Math.floor((t+345600000)/(604800000));
 i['d']=Math.floor(t2/86400000)-Math.floor(t/86400000);
 i['h']=Math.floor(t2/3600000)-Math.floor(t/3600000);
 i['n']=Math.floor(t2/60000)-Math.floor(t/60000);
 i['s']=Math.floor(t2/1000)-Math.floor(t/1000);
 return i[interval];
}

interval參數:參照上面dateAdd方法的interval參數說明,

objDate2:另一個日期對象
 
js中的Math類:

此類是靜態類,不能通過構造函數創建實例的,所以提供的方法都是靜態方法,直接通過類名調用

abs():獲取數字的絕對值,如果提供的參數是字符串,則會首先嘗試將其轉換成數字,如果不能

轉成數字,則直接返回NaN,如果能,則返回其絕對值。

ceil():對傳入的參數進行向上取整計算,如果傳入的不是數字,則會嘗試將其進行數字轉換,

不能轉換則之間則直接返回NaN

floor():對傳入參數進行向下取整計算,如果傳入的不是數字,則會嘗試將其進行數字轉換,

不能轉換則之間則直接返回NaN

max(x1,x2,x3.....xn):返回指定參數中的最大值,如果指定參數中有一個不能轉換成數字,則直接

返回NaN,如果沒有傳入參數,則返回負無窮大

min(x1,x2,x3.....xn):返回指定參數中的最小值,如果指定參數中有一個不能轉換成數字,則直接

返回NaN,如果沒有傳入參數,則返回正無窮大

pow(x,y):返回x 的 y 次冪,如果計算結果是負數,則返回NaN,如果由於計算結果太大,導致浮點溢出,

則返回正無窮大

random():返回0 ~ 1 之間的一個隨機數。

round(x):與 x 最接近的整數。如果x是正數,那麼0.5會轉成1,如果是-0.5,那麼會捨掉,

 -0.50001才會轉成-1

sqrt(x):返回一個數的平方根,如果 x 小於 0,則返回 NaN,

如果傳入的不是數字,則會嘗試將其進行數字轉換,

不能轉換則之間則直接返回NaN

js的RegExp正則對象:

創建正則對象兩種方式:

1. /pattern/attributes

pattern是正則表達式部分,

attributes:可選參數,包含屬性 "g"、"i" 和 "m"等取值

g:表示全局匹配(查找所有匹配而非在找到第一個匹配後停止)

i:表示忽略大小寫

m:表示多行匹配

2,new RegExp(pattern,attributes),第二個參數可選

以上這篇JavaScript原生對象常用方法總結(推薦)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved