JavaScript【對象的學習】

JavaScript對象的瞭解

一、js的String對象
建立String對象：var str = "abc";
方法和屬性（參照W3C文檔詳細學習）
屬性 length：字符串的長度

1 var len = "afjkfdajl"
2 document.write(len.length);//9

1：與HTML類似的方法
- stringObject.bold()：把字符串顯示爲粗體

1 var str = "404boom";
2 document.write(str.bold());

- stringObject.fontcolor(color)：按照指定的顏色來顯示字符串

1 var str = "404boom";
2 document.write(str.fontcolor("red"));

- stringObject.fontsize(size)：按照指定的尺寸來顯示字符串

1 var str = "404boom";
2 document.write(str.fontsize(6));

- stringObject.link(url)：把字符串顯示爲超連接

1 var str = "404boom";
2 document.write(str.link("https://cn.bing.com"));

- stringObject.sub()：把字符串顯示爲下標
- stringObject.sup()：把字符串顯示爲上標

1 var s1 = "3";
2 var s2 = "2";//中間數字
3 var s3 = "3";
4 document.write(s1.sub());
5 document.write(s2);
6 document.write("<hr />")
7 document.write(s1.sup());
8 document.write(s2);

2：與java類似的方法
- stringObject.concat(stringX,stringX,...,stringX)：用於鏈接兩個或多個字符串

1 var str1 = "xiao";
2 var str2 = "yyun"
3 var str3 = "小云雲";
4 document.write(str1.concat(str2).concat(str3));//xiaoyyun小云雲

- stringObject.charAt(index)：返回指定位置的字符
注：字符串中第一個字符的下標是 0。若是參數 index 不在 0 與 string.length 之間，該方法將返回一個空字符串

1 var str = "JavaScript";
2 document.write(str.charAt(2));//v

- stringObject.indexOf(searchvalue,fromindex)：返回某個指定的字符串值在字符串中首次出現的位置
注：indexOf() 方法對大小寫敏感！若是要檢索的字符串值沒有出現，則該方法返回 -1

1 var str = "JavaScript" ;
2 document.write(str.indexOf("S"));//4

- stringObject.split(separator,howmany)：把一個字符串分割成字符串數組

1 var str = "h e l l o";
2 document.write(str.split(" "));
3 //遍歷數組
4 for(var i;i<str.length;i++){
5     document.write(i);
6 }

- stringObject.replace(regexp/substr,replacement)：字符串中用一些字符替換另外一些字符，或替換一個與正則表達式匹配的子串

1 var str = "hello world";
2 document.write(str.replace("world","JavaScript"));//hello JavaScript

- stringObject.substr(start,length)：在字符串中抽取從 start 下標開始的指定數目的字符

1 var str = "afdjaskjflsdfsa";
2 document.write(str.substr(2,5));//djask

- stringObject.substring(start,stop)：用於提取字符串中介於兩個指定下標之間 的字符
注：substring() 方法返回的子串包括 start 處的字符，但不包括 stop 處的字符。若是參數 start 與 stop 相等，那麼該方法返回的就是一個空串（即長度爲 0 的字符串）。若是 start 比 stop 大，那麼該方法在提取子串以前會先交換這兩個參數。

1 var str = "fdhskfjksjfdsa";
2 document.write(str.substring(3,6));//skf[3,6)

二、js的Array對象

建立數組（三種）
- var arr1 = [1,2,3];
- var arr2 = new Array(3); //長度是3
- var arr3 = new Array(1,2,3); //數組中的元素是1 2 3
- var arr = []; //建立一個空數組
屬性：length：查看數組的長度
經常使用方法：
- arrayObject.concat(arrayX,arrayX,......,arrayX)：鏈接兩個或多個數組

1 var arr1 = [2,4,5];
2 var arr2 = ["d",7,"fsda"];
3 var arr3 = ["dfa",78,"fsda"];
4 document.write(arr1.concat(arr2).concat(arr3));//2,4,5,d,7,fsda,dfa,78,fsda

- arrayObject.join(separator)：把數組中的全部元素放入一個字符串
separator可選。指定要使用的分隔符。若是省略該參數，則使用逗號做爲分隔符

1 var arr = new Array(3)
2 arr[0] = "George"
3 arr[1] = "John"
4 arr[2] = "Thomas"
5 document.write(arr.join())//George,John,Thomas
6 document.write(arr.join("-"))//George-John-Thomas

-arrayObject.push(newelement1,newelement2,....,newelementX)向數組的末尾添加一個或多個元素，並返回新的長度

1 var arr = new Array(3)
2 arr[0] = "George"
3 arr[1] = "John"
4 arr[2] = "Thomas"
5         
6 document.write(arr + "<br />")//George,John,Thomas
7 document.write(arr.push("James") + "<br />")//4
8 document.write(arr)//George,John,Thomas,James

- arrayObject.shift()：用於把數組的第一個元素從其中刪除，並返回第一個元素的值
注：若是數組是空的，那麼 shift() 方法將不進行任何操做，返回 undefined 值。請注意，該方法不建立新數組，而是直接修改原有的 arrayObject

1 var arr = ["zhangsan","lisi","wangwu","zhaoliu"];
2 document.write("old array: "+arr);//old array: zhangsan,lisi,wangwu,zhaoliu
3 document.write("<br/>");
4 document.write("return: "+arr.shift());//return: zhangsan
5 document.write("<br/>");
6 document.write("new array: "+arr);//new array: lisi,wangwu,zhaoliu

- arrayObject.pop()：用於刪除並返回數組的最後一個元素
注：pop() 方法將刪除 arrayObject 的最後一個元素，把數組長度減 1，而且返回它刪除的元素的值。若是數組已經爲空，則 pop() 不改變數組，並返回 undefined 值

1 var arr = ["zhangsan","lisi","wangwu","zhaoliu"];
2 document.write("old array: "+arr);//old array: zhangsan,lisi,wangwu,zhaoliu
3 document.write("<br/>");
4 document.write("return: "+arr.pop());//return: zhaoliu
5 document.write("<br/>");
6 document.write("new array: "+arr);//new array: zhangsan,lisi,wangwu

- arrayObject.reverse()：用於顛倒數組中元素的順序

1 var arr = ["Tom","John","wangwu"]
2 document.write(arr + "<br />")//Tom,John,wangwu
3 document.write(arr.reverse());//wangwu,John,Tom

- arrayObject.unshift(newelement1,newelement2,....,newelementX)：可向數組的開頭添加一個或更多元素，並返回新的長度

1 var arr = ["zhangsan","lisi","wangwu","zhaoliu"];
2 document.write("old array: "+arr);//old array: zhangsan,lisi,wangwu,zhaoliu
3 document.write("<br/>");
4 document.write(arr.unshift("new"));//return: 5
5 document.write("<br/>");
6 document.write("new array: "+arr);//new array: new,zhangsan,lisi,wangwu,zhaoliu

三、js的Date對象

注意點：
getMonth()：獲取當前的月：返回的是 0-11月，若是想要獲得準確的值，加1
getDay()：星期,返回的是 (0 ~ 6)：外國朋友，把星期日做爲一週的第一天，星期日返回的是 0，而星期一到星期六 返回的是 1-6

 1 <script type="text/javascript">
 2         //獲取當前時間
 3         var date = new Date();
 4         document.write(date);  
 5 
 6         //轉換成習慣的格式
 7         document.write("<hr/>");
 8         document.write(date.toLocaleString());
 9 
10         //獲得當前的年
11         document.write("<hr/>");
12         document.write("year: "+date.getFullYear());
13 
14         //獲得當前的月
15         document.write("<hr/>");
16         var date1 = date.getMonth()+1;
17         document.write("month: "+date1);
18 
19         //獲得當前的星期
20         document.write("<hr/>");
21         document.write("week: "+date.getDay());
22 
23         //獲得當前的天
24         document.write("<hr/>");
25         document.write("day: "+date.getDate());
26 
27         //獲得當前的小時
28         document.write("<hr/>");
29         document.write("hour: "+date.getHours());
30 
31         //獲得當前的分鐘
32         document.write("<hr/>");
33         document.write("minute: "+date.getMinutes());
34 
35         //獲得當前的秒
36         document.write("<hr/>");
37         document.write("second: "+date.getSeconds());
38 
39         //獲得毫秒數
40         document.write("<hr/>");
41         document.write("times: "+date.getTime());
42 </script>

View Code

四、js的Math對象
數學的運算,裏面的都是靜態方法，使用能夠直接使用 Math.方法()

ceil(x): 向上舍入
floor(x)：向下舍入
round(x)：四捨五入
random()：獲得隨機數（僞隨機數）返回 0 ~ 1 之間的隨機數
- 獲得0-9的隨機數
Math.random()*10
Math.floor(Math.random()*10));

 1 <script type="text/javascript">
 2     var num = 10.8;
 3     document.write("old : "+num);
 4     document.write("<br/>");
 5     document.write("ceil: "+Math.ceil(num));
 6 
 7     document.write("<br/>");
 8     document.write("floor: "+Math.floor(num));
 9         
10     document.write("<br/>");
11     document.write("round: "+Math.round(num));
12         
13     //random方法
14     document.write("<hr/>");
15     document.write(Math.random());
16 
17     //獲得0-9的隨機數
18     document.write("<hr/>");
19     //document.write(Math.random()*10);
20     document.write(Math.floor(Math.random()*10));
21     //pow(x,y)  2的5次方
22     document.write("<hr/>");
23     document.write(Math.pow(2,5));
24 </script>