JavaScript物件總結
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
開發工具與關鍵技術:Adobe Dreamweaver JavaScript
作者:彭琦旺
撰寫時間:2020年4月26日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
JavaScript的物件
內建物件:由ES標準中物件,在任何ES的實作中都可以儲存多個不同資料的屬性
宿主物件
自定義物件
內建物件:
一.陣列(Array)
- 陣列也是物件(內建物件)
- 它和我們普通物件功能類似,也是用來存盤一些值的
- 不同的是普通物件使用字串作為屬性名
而陣列是使用數字來作為索引操作元素
- 索引:
從0開始的整數就是索引
- 陣列的存盤性能比普通物件要好,在開發中我們經常使用陣列來存盤一些資料
Array物件屬性:
陣列: 普通物件:
屬性名: 屬性值: 索引值: 值:
Gender 男 5 0
Age 12 4 undefined
Name zhangsan 3 false
1.//創建陣列物件
var arr=new Array();
console.log(typeof arr);//object
2.向陣列中添加元素
語法:陣列[索引] = 值
arr[0]=12;
arr[1]=34;
console.log(arr[2]);//undefined
3.讀取陣列中的元素
語法:陣列[索引]
如果讀取不存在的索引,不會報錯而是回傳undefined
4.獲取陣列的長度,可以使用length這個屬性獲取
語法:陣列.length
對于連續的陣列,使用length可以獲取到陣列的長度(元素的個數)
對于非連續的陣列,使用length匯獲取到陣列的最大的(索引+1)
盡量不要創建非連續陣列
5. 修改length
- 如果修改的length大于原長度,則多出部分會空出來
- 如果修改的length小于原長度,則多出的部分會被洗掉
arr.length=10;
console.log(arr); empty
[JavaScript陣列字面量]
1.使用字面量來創建陣列
var arr1=[];
語法:[]
2.使用字面量創建陣列時,可以在創建時就指定陣列中的元素
3.使用建構式創建陣列時,也可以同時添加元素,將要添加的元素作為建構式的引數傳遞,元素之間使用,隔開
4.陣列的值可以是任意的資料型別,包含物件的
var arr6=["hello",123,false,undefined,null];
5.陣列中可以存放函式
var arr7=[function(){alert(123);},function(){alert("helloworld");}];
console.log(arr7[0]);
6.二維陣列
var arr8=[
[1,3,4,5],
[1,4,6,7]
];
[JavaScript陣列的方法]
1. concat():連接兩個或更多的陣列,并回傳結果。
var arr=["小明","小紅","小橙"];
var arr1=["小黑","小綠","小藍"];
var arr2=arr.concat(arr1);
2. join():把陣列的所有元素放入一個字串。元素通過指定的分隔符進行分隔。
語法:arrayObject.join(separator)
var str=arr.join("~~");
console.log(arr);//[小明,小紅,小橙]
console.log(str);// 小明~~小紅~~小橙
3.push():向陣列的末尾添加一個或更多元素,并回傳新的長度。可以將要添加的元素作為方法的引數傳遞,這樣這些元素將會自動添加到陣列的末尾,該方法會將陣列新的長度作為回傳值回傳
arrayObject.push(newelement1,newelement2,....,newelementX)
4. pop():洗掉并回傳陣列的最后一個元素
var result=arr.pop();
arr.pop();
console.log("result="+result);
console.log(arr);
5. unshift():向陣列開頭添加一個或多個元素,并回傳新的陣列長度,向前邊插入元素以后,其他元素的索引會依次調整
var num=arr.unshift("小白","小黑");
console.log("num="+num);
console.log(arr);
6. shift():可以洗掉陣列的第一個元素,并將被洗掉的元素作為回傳值回傳
arr.shift();
arr.shift();
[JavaScript陣列的遍歷]
1. 創建一個陣列
var arr=["小明","小紅","小橙","小藍","小綠"];
2. 所謂的遍歷陣列,就是將陣列中所有的元素都取出來
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}
3. 創建一個函式,可以將arrPerson中年滿18歲的Person提取出來,然后封裝到到一個新的陣列并回傳
[JavaScript陣列的遍歷foreach(拓展)]
1.一般我們都是使用for回圈去遍歷陣列,
JS中還為我們提供了一個方法,用來遍歷陣列
forEach()
- 這個方法只支持IE8以上的瀏覽器
IE8及以下的瀏覽器均不支持該方法,所以如果需要兼容IE8,則不要使用forEach
如果考慮到兼容問題還是使用for回圈
var arr=["小明","小紅","小橙","小藍","小綠"];
2.forEach()方法需要一個函式作為引數
- 像這種函式,由我們創建但是不由我們呼叫的,我們稱為回呼函式
- 陣列中有幾個元素函式就會執行幾次,每次執行時,瀏覽器將會遍歷到的元素以實參的形式傳遞進來,我們可以來定義形參讀取這些內容
- 瀏覽器會在回呼函式中傳遞三個引數:
第一個引數,就是當前正在遍歷的元素
第二個引數,就是當前正在遍歷的元素的索引
第三個引數,就是正在遍歷的陣列
arr.forEach(function(value,index,obj){
// console.log(value);
console.log(index);
[JavaScript_arguments]
在呼叫函式時,瀏覽器每次都會傳遞進來兩個隱含的引數:
1.函式的背景關系物件 this
2.封裝實參的物件arguments
- arguments是一個類陣列物件,它也可以通過索引來操作陣列,也可以獲取長度
- 在呼叫函式時,我們所傳遞的實參都會在arguments中保存
- arguments.length可以用來獲取實參的長度
- 我們即使不定義形參,也可以通過arguments來使用實參,比較麻煩
arguments[0] 表示第一個實參
arguments[1] 表示第二個實參
- 它里面有一個屬性叫做callee,
這個屬性對應一個函式物件,就是當前正在執行的函式物件
二.JavaScript 日期物件Date
Date物件(內建物件)
- 在JS中使用Date物件來表示一個時間
var d=new Date();
console.log(d);//當前執行代碼的時間
1.創建一個Date物件
如果時間使用建構式創建一個Date物件,則會封裝為當前代碼執行的時間
var date2=new Date("2020-03-23 12:34:12");
console.log(date2); //2020-03-23 12:34:12/
2.getDate() - 獲取當前日期物件時幾日。回傳當日的日期和時間。
var date=d.getDate();
3.getDay() - 獲取當前日期是星期幾,會回傳一個0~6的值
0 表示周日,1 表示周一...,6 表示周六
var day=d.getDay();
4.getMonth() - 獲取當前日期物件的月份
- 會回傳一個0~11的值,0 表示 一月,1 表示二月,...,11 表示十二月
var month=d.getMonth();
5. getFullYear() - 獲取物件以四位數字回傳年份
var year=d.getFullYear();
獲取當前日期物件的小時
var hours=d.getHours();
獲取當前日期物件的分鐘
var minute=d.getMinutes();
獲取當前日期物件的秒數
var second=d.getSeconds();
6.getTime()
- 獲取當前日期物件的時間戳
- 時間戳,指的是從格林威治標準時間的1970年1月1日,0時0分0秒
到當前日期所花費的毫秒數(1秒=1000毫秒)
- 計算機底層在保存時間時使用都是時間戳
7.可以使用時間戳來測驗代碼的執行性能
//獲取當前的時間戳
var start=Date.now();
for(var i=0;i<100;i++){
console.log(i);
}
var end=Date.now();
console.log("本次代碼執行時間為:"+(end-start)+"毫秒");
[JavaScript_Math物件]
Math物件和其他物件不同,它不是一個建構式,
它屬于一個工具類不用創建物件,它里面封裝了數學運算相關的屬性和方法
- 例如:
Math.PI 表示圓周率(約等于3.14159)
var date=new Date();//
console.log(Math.PI);
1.Math.abs(x) - 回傳一個數的絕對值
2.Math.sin(x) - 回傳一個數的正弦
3.Math.ceil() - 可以對一個數進行向上取整,小數位只要有值就自動進1
4.Math.floor() - 可以對一個數進行向下取整,小數部分會被舍掉
5.Math.round() - 可以對一個數進行四舍五入取整
Math.random()
- 可以用來生成一個0-1之間的亂數
Math.random()
- 可以用來生成一個0-10之間的亂數(整數)
Math.round(Math.random()*10)
- 可以用來生成一個0-X之間的亂數(整數)
Math.round(Math.random()*X)
- 可以用來生成一個1-10之間的亂數(整數)
Math.round(Math.random()*9)+1
- 可以用來生成一個1-X之間的亂數(整數)
Math.round(Math.random()*(X-1))+1
- 可以用來生成一個Y-X之間的亂數(整數)
Math.round(Math.random()*(X-Y))+Y
var num=Math.random();
for(var i=0;i<100;i++){
num=Math.random()*10;//0-10之間的亂數
num=Math.round(Math.random()*10);//0-10之間的隨機整數
num=Math.round(Math.random()*9)+1;//1-10之間的亂數(整數)
2到7之間的亂數
num=Math.round(Math.random()*5)+2;// 2到7之間的亂數(整數)
5到23之間的亂數
num=Math.round(Math.random()*18)+5;
console.log(num);
}
document.write(Math.round(4.7))//5
JavaScript物件總結
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
開發工具與關鍵技術:Adobe Dreamweaver JavaScript
作者:彭琦旺
撰寫時間:2020年4月26日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
JavaScript的物件
內建物件:由ES標準中物件,在任何ES的實作中都可以儲存多個不同資料的屬性
宿主物件
自定義物件
內建物件:
一.陣列(Array)
- 陣列也是物件(內建物件)
- 它和我們普通物件功能類似,也是用來存盤一些值的
- 不同的是普通物件使用字串作為屬性名
而陣列是使用數字來作為索引操作元素
- 索引:
從0開始的整數就是索引
- 陣列的存盤性能比普通物件要好,在開發中我們經常使用陣列來存盤一些資料
Array物件屬性:
陣列: 普通物件:
屬性名: 屬性值: 索引值: 值:
Gender 男 5 0
Age 12 4 undefined
Name zhangsan 3 false
1.//創建陣列物件
var arr=new Array();
console.log(typeof arr);//object
2.向陣列中添加元素
語法:陣列[索引] = 值
arr[0]=12;
arr[1]=34;
console.log(arr[2]);//undefined
3.讀取陣列中的元素
語法:陣列[索引]
如果讀取不存在的索引,不會報錯而是回傳undefined
4.獲取陣列的長度,可以使用length這個屬性獲取
語法:陣列.length
對于連續的陣列,使用length可以獲取到陣列的長度(元素的個數)
對于非連續的陣列,使用length匯獲取到陣列的最大的(索引+1)
盡量不要創建非連續陣列
5. 修改length
- 如果修改的length大于原長度,則多出部分會空出來
- 如果修改的length小于原長度,則多出的部分會被洗掉
arr.length=10;
console.log(arr); empty
[JavaScript陣列字面量]
1.使用字面量來創建陣列
var arr1=[];
語法:[]
2.使用字面量創建陣列時,可以在創建時就指定陣列中的元素
3.使用建構式創建陣列時,也可以同時添加元素,將要添加的元素作為建構式的引數傳遞,元素之間使用,隔開
4.陣列的值可以是任意的資料型別,包含物件的
var arr6=["hello",123,false,undefined,null];
5.陣列中可以存放函式
var arr7=[function(){alert(123);},function(){alert("helloworld");}];
console.log(arr7[0]);
6.二維陣列
var arr8=[
[1,3,4,5],
[1,4,6,7]
];
[JavaScript陣列的方法]
1. concat():連接兩個或更多的陣列,并回傳結果。
var arr=["小明","小紅","小橙"];
var arr1=["小黑","小綠","小藍"];
var arr2=arr.concat(arr1);
2. join():把陣列的所有元素放入一個字串。元素通過指定的分隔符進行分隔。
語法:arrayObject.join(separator)
var str=arr.join("~~");
console.log(arr);//[小明,小紅,小橙]
console.log(str);// 小明~~小紅~~小橙
3.push():向陣列的末尾添加一個或更多元素,并回傳新的長度。可以將要添加的元素作為方法的引數傳遞,這樣這些元素將會自動添加到陣列的末尾,該方法會將陣列新的長度作為回傳值回傳
arrayObject.push(newelement1,newelement2,....,newelementX)
4. pop():洗掉并回傳陣列的最后一個元素
var result=arr.pop();
arr.pop();
console.log("result="+result);
console.log(arr);
5. unshift():向陣列開頭添加一個或多個元素,并回傳新的陣列長度,向前邊插入元素以后,其他元素的索引會依次調整
var num=arr.unshift("小白","小黑");
console.log("num="+num);
console.log(arr);
6. shift():可以洗掉陣列的第一個元素,并將被洗掉的元素作為回傳值回傳
arr.shift();
arr.shift();
[JavaScript陣列的遍歷]
1. 創建一個陣列
var arr=["小明","小紅","小橙","小藍","小綠"];
2. 所謂的遍歷陣列,就是將陣列中所有的元素都取出來
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}
3. 創建一個函式,可以將arrPerson中年滿18歲的Person提取出來,然后封裝到到一個新的陣列并回傳
[JavaScript陣列的遍歷foreach(拓展)]
1.一般我們都是使用for回圈去遍歷陣列,
JS中還為我們提供了一個方法,用來遍歷陣列
forEach()
- 這個方法只支持IE8以上的瀏覽器
IE8及以下的瀏覽器均不支持該方法,所以如果需要兼容IE8,則不要使用forEach
如果考慮到兼容問題還是使用for回圈
var arr=["小明","小紅","小橙","小藍","小綠"];
2.forEach()方法需要一個函式作為引數
- 像這種函式,由我們創建但是不由我們呼叫的,我們稱為回呼函式
- 陣列中有幾個元素函式就會執行幾次,每次執行時,瀏覽器將會遍歷到的元素以實參的形式傳遞進來,我們可以來定義形參讀取這些內容
- 瀏覽器會在回呼函式中傳遞三個引數:
第一個引數,就是當前正在遍歷的元素
第二個引數,就是當前正在遍歷的元素的索引
第三個引數,就是正在遍歷的陣列
arr.forEach(function(value,index,obj){
// console.log(value);
console.log(index);
[JavaScript_arguments]
在呼叫函式時,瀏覽器每次都會傳遞進來兩個隱含的引數:
1.函式的背景關系物件 this
2.封裝實參的物件arguments
- arguments是一個類陣列物件,它也可以通過索引來操作陣列,也可以獲取長度
- 在呼叫函式時,我們所傳遞的實參都會在arguments中保存
- arguments.length可以用來獲取實參的長度
- 我們即使不定義形參,也可以通過arguments來使用實參,比較麻煩
arguments[0] 表示第一個實參
arguments[1] 表示第二個實參
- 它里面有一個屬性叫做callee,
這個屬性對應一個函式物件,就是當前正在執行的函式物件
二.JavaScript 日期物件Date
Date物件(內建物件)
- 在JS中使用Date物件來表示一個時間
var d=new Date();
console.log(d);//當前執行代碼的時間
1.創建一個Date物件
如果時間使用建構式創建一個Date物件,則會封裝為當前代碼執行的時間
var date2=new Date("2020-03-23 12:34:12");
console.log(date2); //2020-03-23 12:34:12/
2.getDate() - 獲取當前日期物件時幾日。回傳當日的日期和時間。
var date=d.getDate();
3.getDay() - 獲取當前日期是星期幾,會回傳一個0~6的值
0 表示周日,1 表示周一...,6 表示周六
var day=d.getDay();
4.getMonth() - 獲取當前日期物件的月份
- 會回傳一個0~11的值,0 表示 一月,1 表示二月,...,11 表示十二月
var month=d.getMonth();
5. getFullYear() - 獲取物件以四位數字回傳年份
var year=d.getFullYear();
獲取當前日期物件的小時
var hours=d.getHours();
獲取當前日期物件的分鐘
var minute=d.getMinutes();
獲取當前日期物件的秒數
var second=d.getSeconds();
6.getTime()
- 獲取當前日期物件的時間戳
- 時間戳,指的是從格林威治標準時間的1970年1月1日,0時0分0秒
到當前日期所花費的毫秒數(1秒=1000毫秒)
- 計算機底層在保存時間時使用都是時間戳
7.可以使用時間戳來測驗代碼的執行性能
//獲取當前的時間戳
var start=Date.now();
for(var i=0;i<100;i++){
console.log(i);
}
var end=Date.now();
console.log("本次代碼執行時間為:"+(end-start)+"毫秒");
[JavaScript_Math物件]
Math物件和其他物件不同,它不是一個建構式,
它屬于一個工具類不用創建物件,它里面封裝了數學運算相關的屬性和方法
- 例如:
Math.PI 表示圓周率(約等
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/58561.html
標籤:JavaScript
