10、javaScript對象

10、javaScript對象

1、對象的定義

object / obj

存儲數據方式：屬性: 屬性值

定義方式：

一、字面量：經過{}來定義一個空對象

1 var obj = {};

二、構造函數

1 var obj = new Object();

與數組的區別：

• 數組只能使用索引下標，不能使用字符串下標
• 對象能夠使用字符串做爲屬性（鍵名），經過操做屬性調用屬性值

2、對象的基本操做

與數組的操做基本相似，經過屬性來操做屬性值

對象.屬性

• 點語法是特殊規定，能夠不加引號

• 點語法不支持數值屬性的調用

• 點語法不會解析變量，只會將變量，按照字符串處理

1 var obj = { name: '張三', age: 18, 100: 100 };
2 console.log(obj.name); // 張三

對象[屬性]

• 對象的屬性其實是字符串形式，必需要加引號

• 數值做爲屬性時，調用數據加不加引號都行

• 支持變量解析，能夠解析變量中存儲的數據，做爲屬性在對象中調用屬性值

• 變量寫在[]中，必定不要加引號，加了引號就成了字符串了

1 var obj = { name: '張三', age: 18, 100: 100 };
2 console.log(obj['name']); // 張三
3 console.log(obj[name]); // undefined

對象的操做：

• 修改：

  • 與數組的操做相似，是對已有的屬性進行賦值

  • 後賦值的數據，會覆蓋以前存儲的數據

• 新增：

  • 對不存在的屬性進行賦值，操做效果就是給對象新增單元

• 刪除：

  • delete(對象.屬性)：刪除對象中的指定屬性

  • delete(對象[屬性])：刪除對象中的指定屬性

3、對象的循環

for...in語法支持對象的循環

1 var obj = { name: '張三', age: 18, sex: '男', addr: '北京', hobby: '吃雞' };
2 for (var key in obj) {
3   // 點語法不解析變量,執行結果是找key這個屬性,結果是undefined
4   // []語法解析變量，key是對象的屬性，obj[key]得到屬性值
5   console.log(obj.key, obj[key]);
6 }

4、對象的應用

一、記錄字符出現的次數

• 定義一個空對象

• for...in循環遍歷str

• 經過obj[]方法查找對象中是否有該屬性（鍵名）

  • 沒有該屬性（即爲undefined），就新增屬性，屬性值爲1

  • 有該屬性（鍵名），屬性值（鍵值）加1

 1 var str = 'aaaabbbbbcccccdddeeefffgggggg';
 2 var obj = {};
 3 
 4 // i存儲的是字符串的索引，str[i]是對應的字符
 5 for (var i in str) {
 6   if (obj[str[i]] === undefined) {
 7     // 若是調用結果是undefined,證實對象中沒有這個鍵名
 8     // 新增對象的單元,鍵名是這個字符,鍵值是 1
 9     obj[str[i]] = 1;
10   } else {
11     // 調用結果不是undefined,證實對象中已經存在這個鍵名
12     // 存儲數值數據 +=1 或者 ++
13     obj[str[i]]++;
14   }
15 }

二、記錄數組中數據出現的次數

 1 var arr = [1,2,3,4,5,1,2,3,4,5,6,1,2,3,4,5,6,7,1,2];
 2 
 3 var obj = {};
 4 
 5 arr.forEach(function(v){
 6   if(obj[v] === undefined){
 7     obj[v] = 1;
 8   }else{
 9     obj[v]++;
10   }
11 })

5、內置對象

JavaScript定義好的，能夠直接使用的對象

一、Math對象

內置數學/算術對象

math.random()：隨機數值

• Math.random() 生成 0-1的小數，能夠是0，但永遠不會是1

• 生成 a - b 的隨機數值，包含 a 而且包含 b

1 var num = parseInt(Math.random()*(b+1-a) +a);

Math.round()：四捨五入取整

• 沒有小數部分，四捨五入取整，保留整數部分

• 不改變變量存儲的原始數值數據

1 var float1 = 123.56789;
2 float1 = Math.round(float1);
3 console.log(float1); // 124

Math.floor()：向下取整

• 徹底捨棄小數部分

1 var float2 = 123.999999999;
2 float2 = Math.floor(float2);
3 console.log(float2); // 123

Math.cell()：向上取整

• 整數部分加1取整

1 var float3 = 123.00000000001;
2 float3 = Math.ceil(float3);
3 console.log(float3); // 124

Math.pow()：乘方運算/冪運算

1 // 2的3次方,結果是8
2 console.log(Math.pow(2, 3))

Math.abs()：絕對值

1 console.log(Math.abs(-10)); // 10

Math.sqrt()：平方根，只有正數

1 console.log(Math.sqrt(9)); // 3

Math.PI：圓周率數值

1 console.log(Math.PI);

二、Date對象

內置時間對象

使用步驟

• 建立時間對象

1 var d = new Date();
2 // 獲取的時間是本地時間,也就是你當前所在時區的時間
3 // 中國時間是東八區,世界標準時間 +8小時

使用時間對象

• 獲取4位年份

1 var year = d.getFullYear();

• 獲取月份，範圍是0-11，實際月份是執行結果+1

1 var month = d.getMonth() + 1;

• 獲取日期

1 var date = d.getDate();

• 獲取星期，範圍是 0 - 6

1 // 0表示星期日，1表示星期一
2 var week = d.getDay();
3 // 定義一個數組,來存儲執行結果 0-6 對應的星期
4 var weekArr = ['日', '一', '二', '三', '四', '五', '六'];
5 week = `星期${weekArr[week]}`;

• 獲取小時，24小時格式

1 var hours = d.getHours();

• 獲取分鐘

1 var minutes = d.getMinutes();

• 獲取秒

1 var seconds = d.getSeconds();

設定date

• 字符串方法

1 // 設定完整的時間, 年份日,時分秒,會自定計算星期
2 var d = new Date('1982-10-12 8:8:0');
3 var d = new Date('1982/10/12 8:8:0');
4 var d = new Date('1982 10 12 8:8:0');
5 var d = new Date('1982,10,12 8:8:0');

1 // 只設定年，默認執行 月日,時分秒
2 var d = new Date('2020');

1 // 只設定年月，默認執行 日,時分秒
2 var d = new Date('2020/5');

1 // 只設定年月日，默認執行 時分秒
2 var d = new Date('2020/5/6');

1 // 只設定年月日,小時分鐘  默認執行 秒
2 // 不容許獨立設定小時,至少要設定小時分鐘
3 var d = new Date('2020/5/6 8:10');

• 設定多個字符串參數，表示日期時間

1 // 至少要設定年月  
2 // 設定月份的數值是 0 - 11 對應 1月 - 12月
3 var d = new Date(2020,7); // 對應的是2020年8月

1 // 設定年月日
2 var d = new Date(2020,6,2);

1 // 設定年月日，時
2 var d = new Date(2020,6,2,10);

1 // 設定年月日，時分
2 var d = new Date(2020,6,2,10,10); 

1 // 設定年月日 時,分,秒
2 // 完整時間
3 var d = new Date(2020,6,2,10,10,10);

時間戳

• 當前時間到1970年1月1日0時0分0秒的時間差

• JavaScript時間戳的單位是毫秒（1秒=1000毫秒）

1 // 設定時間對象
2 var d = new Date();
3 // 默認獲取的時間單位是毫秒，須要轉化成秒
4 var times = Math.floor( d.getTime() / 1000 );

三、定時器

按照指定的時間間隔循環往復執行程序

基本語法

• 按照指定時間間隔來執行匿名函數中定義的程序

• 時間間隔單位是毫秒

• setInterval( function(){ 程序內容 }, 時間間隔 )

1 var interval = setInterval(function(){
2   console.log('按設定時間間隔打印')
3 }, 1000);

• 默認定時器會一直執行，除非終止定時器
  • 定義定時器時，使用一個變量來存儲定時器，存儲的內容是一個數值，這個數值表示當前定時器是整個程序中第幾個定時器
  • 使用程序來終止定時器
  • clearInterval(存儲定時器的變量)

1 clearInterval(interval);

• 注意：定時器不是一上來就執行，要在設定的時間間隔以後執行，須要當即執行，執行程序設定在定時器外面

定時器的異步執行

• 在JavaScript中，普通程序都是同步執行的，遵循順序流程、分支流程、循環流程三種流程控制

• 特殊程序是異步執行的（包括定時器、延時器、ajax請求）

• 全部的異步程序，都會在同步程序執行完以後纔會執行

• 全部的異步程序會一塊兒開始執行，時間間隔短的先執行，時間間隔長的後執行

四、延時器

根據時間間隔，延遲執行程序，只會執行一次

1 setTimeout( function(){執行的程序}, 延遲時間 )

延時器的清除

1 clearTimeout()

6、保留指定位小數

1 // 數值.toFixed(保留小數位數)
2 var float = 123.456789;
3 console.log(float2.toFixed(2));

 

 

posted on 2021-07-17 14:06  大米飯蓋飯  閱讀(1)  評論(0)  編輯  收藏  舉報