JavaScript對(duì)象內(nèi)置對(duì)象,值類(lèi)型和引用類(lèi)型講解
對(duì)象
JS中的對(duì)象是屬性和行為的結(jié)合體,其中屬性是對(duì)象的靜態(tài)特征,行為又稱(chēng)方法,是對(duì)象的動(dòng)態(tài)特征。
JavaScript中的對(duì)象主要分為三大類(lèi):
- 內(nèi)置對(duì)象
由ES標(biāo)準(zhǔn)中定義的對(duì)象 在任何的ES的實(shí)現(xiàn)中都可以使用,比如Math String Number Boolean Function Object
- 宿主對(duì)象
由JS的運(yùn)行環(huán)境提供的對(duì)象,目前來(lái)講主要是瀏覽器提供的對(duì)象,比如BOM DOM
- 自定義對(duì)象
由開(kāi)發(fā)人員自己創(chuàng)建的對(duì)象
對(duì)象的定義
定義非空對(duì)象
// 非空對(duì)象:
var 對(duì)象名 = {
屬性名: 值,
...
方法名: function([參數(shù)]){
方法體語(yǔ)句;
}
...
}
var p1 = {
color: '黑色',//給對(duì)象添加屬性
weight: '188g',//屬性之間用逗號(hào)隔開(kāi)
screenSize: 6.5,
call: function(name){//給對(duì)象添加方法
console.log("打出電話(huà):"+name);
},
sendMassage: function(msg){
console.log("發(fā)出的信息是:"+msg);
},
playVideo: function(){
console.log("播放視頻");
},
playMusic: function(){
console.log("播放音樂(lè)");
}
}
console.log("手機(jī)顏色:"+p1['color']);//也可以使用 對(duì)象['屬性']來(lái)輸出屬性值
console.log("手機(jī)重量:"+p1.weight);
console.log("屏幕尺寸:"+p1.screenSize);
p1.call("張三");//調(diào)用對(duì)象的發(fā)方法
p1["sendMassage"]("helo");
p1.playVideo();
p1.playMusic();
console.log(p1);
使用new Object()創(chuàng)建對(duì)象
var p = new Object(); // 創(chuàng)建一個(gè)空對(duì)象p
p2.name = '劉備';
p2.sex = '男';
p2.age = 32;
p2.sayHello = function(){
console.log('Hello');
}
p2.sayHello();//調(diào)用對(duì)象的方法
可以使用構(gòu)造函數(shù)來(lái)創(chuàng)建對(duì)象:
語(yǔ)法: new 構(gòu)造函數(shù)名( )
function Student(name,sex,age){
this.name = name;//這里的this指向的是構(gòu)造函數(shù)新創(chuàng)建的對(duì)象
this.sex = sex;
this.age = age;
this.show = function(){
console.log("姓名:"+this.name)
console.log("姓別:"+this.sex)
console.log("年齡:"+this.age)
}
}
var s1 = new Student('喬峰','男',28);//s1為構(gòu)造函數(shù)創(chuàng)建的新對(duì)象 即實(shí)例
s1.show();
var s2 = new Student('段譽(yù)','男',23);
s2.show();
注意:"構(gòu)造函數(shù)"可以有參數(shù),也可以沒(méi)有參數(shù),如果沒(méi)有參數(shù)小括號(hào)可以省略
遍歷對(duì)象的成員
遍歷對(duì)象的屬性和方法:使用for…in循環(huán)
for(var 變量名 in 對(duì)象名){
循環(huán)語(yǔ)句
}
function Student(name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
this.show = function(){
console.log("姓名:"+this.name)
console.log("姓別:"+this.sex)
console.log("年齡:"+this.age)
}
}
// s2是要遍歷的對(duì)象
var s2 = new Student('段譽(yù)','男',23);
for(var k in s2){
console.log(k);//依次輸出 name sex age show()
console.log(s2[k]);//依次輸出 段譽(yù) 男 23
}
in運(yùn)算符
判斷成員(屬性)在對(duì)象中是否存在,存在返回true;不存在返回false。
JS內(nèi)置對(duì)象
JavaScript提供了很多常用的內(nèi)置對(duì)象,包括數(shù)學(xué)對(duì)象Math、日期對(duì)象Date、數(shù)組對(duì)象Array以及字符串對(duì)象String等。
Math對(duì)象
Math對(duì)象:用來(lái)對(duì)數(shù)字進(jìn)行與數(shù)學(xué)相關(guān)的運(yùn)算,不需要實(shí)例化對(duì)象,可以直接使用其靜態(tài)屬性和靜態(tài)方法.
Math對(duì)象:不需要實(shí)例化 Math.PI:算數(shù)常量PI Math.abs(x):返回x的絕對(duì)值 Math.max(args...):返回最大數(shù) Math.min(args...):返回最小數(shù) Math.pow(x,y):返回x的y次方 Math.sqrt(x):返回x的算術(shù)平方根 Math.random():返回0.0到1.0之間的隨機(jī)數(shù) Math.round(x):返回最接近x的整數(shù) Math.floor(x):返回一個(gè)小于等于x 并且與它最接近的整數(shù) Math.ceil(x):返回一個(gè)大于等于x 并且與它最接近的整數(shù)
Date對(duì)象
Date對(duì)象:需要使用new Date()實(shí)例化對(duì)象才能使用,創(chuàng)建一個(gè)對(duì)象 Date()是一個(gè)構(gòu)造函數(shù),可以給該構(gòu)造函數(shù)傳遞參數(shù)生成一個(gè)日期對(duì)象。


// 1.創(chuàng)建一個(gè)Date對(duì)象 沒(méi)有參數(shù)
var date1 = new Date();
console.log(date1);
// 2.傳入年 月 日 時(shí) 分 秒 創(chuàng)建一個(gè)指定日期時(shí)間的Date對(duì)象
// 月份是 0-11
var date2 = new Date(2021,4,22,10,17,55);
console.log(date2);
// 3.傳入一個(gè)日期和時(shí)間字符串創(chuàng)建一個(gè)Date對(duì)象
var date3 = new Date("2021-5-22 18:19:25");
console.log(date3);
console.log(date3.getMonth())//4
console.log(date3.getTime())//表示Date對(duì)象距離1970年1月1日午夜之間的毫秒數(shù)
console.log(date1.toLocaleDateString())//2021/6/14
console.log(date1.toLocaleString())//2021/6/14 下午11:17:36
console.log(date1.getFullYear())//2021
數(shù)組對(duì)象
數(shù)組:是一些類(lèi)型相同的數(shù)據(jù)的集合,它和普通的對(duì)象功能類(lèi)似,也是用來(lái)存儲(chǔ)一些值,數(shù)組是使用數(shù)字來(lái)作為索引操作內(nèi)部的元素。
數(shù)組的創(chuàng)建
- 使用字面量
var arr=[]//創(chuàng)建一個(gè)空數(shù)組
- 使用new Array創(chuàng)建
var arr = new Array();//定義一個(gè)空數(shù)組
判斷一個(gè)對(duì)象是不是數(shù)組的兩種方法:
- isArray(對(duì)象名)
- instanceof: 對(duì)象名 instanceof Array
var arr = []; var obj = {}; console.log(Array.isArray(arr));//true console.log(Array.isArray(obj));//false console.log(arr instanceof Array);//trrue

關(guān)于數(shù)組的其他方法之前的文章要有詳細(xì)介紹,這里不多做解釋。
String對(duì)象
String對(duì)象:字符串對(duì)象,必須使用new String()來(lái)創(chuàng)建
字符串常用方法
- charAt(n) 返回n位置上的字符串
- concat(s1,s2,...) 連接多個(gè)字符串
- charCodeAt(n) 返回n位置上的ASCII碼
- split('分隔符') 將字符串按給定的分隔符 轉(zhuǎn)換成字符串?dāng)?shù)組
- substr(start,length) 從start開(kāi)始提取length個(gè)字符構(gòu)成一個(gè)新串
- substring(from,to) 提取from和to之間的字符串構(gòu)成一個(gè)新串
- toLowerCase() 將串中的大寫(xiě)字符轉(zhuǎn)換成小寫(xiě) 不影響原字符串 返回一個(gè)新字符串
- toUpperCase() 將串中的所有小寫(xiě)轉(zhuǎn)換成大寫(xiě) 不影響原字符串 返回一個(gè)新字符串
- replace(str1,str2) 使用str2替換字符串中的str1 返回替換結(jié)果 不影響原字符串
字符串對(duì)象練習(xí)
// 輸入一個(gè)由字母組成的字符串,統(tǒng)計(jì)串中每個(gè)字母出現(xiàn)的次數(shù)
var str = 'abBSdXbdea';
var lower = new Array(26);// 存放26個(gè)小寫(xiě)字母各自出現(xiàn)的次數(shù)
var upper = new Array(26);// 存放26個(gè)大寫(xiě)字母各自出現(xiàn)的次數(shù)
// 初始化兩個(gè)數(shù)組
for(var i=0;i<lower.length;i++){
lower[i] = 0
upper[i] = 0
}
for(var k=0;k<str.length;k++){
if(str.charAt(k)>='a' && str.charAt(k)<='z'){
lower[str.charCodeAt(k)-97]++
}else if(str.charAt(k)>='A' && str.charAt(k)<='Z'){
upper[str.charCodeAt(k)-65]++
}
}
console.log(lower);
console.log(upper);
/* 輸入一個(gè)十進(jìn)制整數(shù)和一個(gè)數(shù)制(2、8、16)將該十進(jìn)制整數(shù)轉(zhuǎn)換成
對(duì)應(yīng)的數(shù)值格式輸出
取余法:
m=15 k=8
m%k 將余數(shù)存放在數(shù)組中
*/
var m = parseInt(prompt('請(qǐng)輸入一個(gè)整數(shù):'));
var k = parseInt(prompt('請(qǐng)輸入一個(gè)數(shù)制(2~16)'));
var result = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
var arr = new Array();//存放數(shù)制轉(zhuǎn)換的結(jié)果
var i = 0;
while(m!=0){//對(duì)m進(jìn)行數(shù)制轉(zhuǎn)換 將余數(shù)放在arr數(shù)組里
arr[i] = m%k;
m = parseInt(m/k);
i++;
}
var str = '';
if(k==8){
str = '0';
}else if(k==16){
str = '0x';
}
for(var i=arr.length-1;i>=0;i--){
str += result[arr[i]];
}
console.log('轉(zhuǎn)換的結(jié)果為:'+str);
值類(lèi)型和引用類(lèi)型
值類(lèi)型: 簡(jiǎn)單的數(shù)據(jù)類(lèi)型(字符串,數(shù)值型,布爾型,undefined,null)
引用類(lèi)型: 復(fù)雜數(shù)據(jù)類(lèi)型(對(duì)象) 變量中保存的是引用的地址
注意: 引用類(lèi)型的特點(diǎn)是,變量中保存的僅僅是一個(gè)引用的地址,當(dāng)對(duì)變量進(jìn)行賦值時(shí),并不是將對(duì)象復(fù)制了一份,而是將兩個(gè)變量指向了同一個(gè)對(duì)象的引用。
下面對(duì)內(nèi)存中的棧和堆進(jìn)行分析
棧(stack):會(huì)自動(dòng)分配內(nèi)存空間,會(huì)自動(dòng)釋放,簡(jiǎn)單數(shù)據(jù)類(lèi)型存放到棧里面。
堆(heap):動(dòng)態(tài)分配的內(nèi)存,大小不定也不會(huì)自動(dòng)釋放,復(fù)雜數(shù)據(jù)類(lèi)型存放到堆里面。

由此可見(jiàn)存放在堆內(nèi)存中的對(duì)象,變量實(shí)際保存的是一個(gè)指針,這個(gè)指針指向另一個(gè)位置,通過(guò)這個(gè)指針來(lái)尋找堆中存儲(chǔ)的對(duì)象的屬性和值,并且每個(gè)空間大小不一樣,要根據(jù)情況開(kāi)進(jìn)行特定的分配。
到此這篇關(guān)于JavaScript對(duì)象,內(nèi)置對(duì)象,值類(lèi)型和引用類(lèi)型講解的文章就介紹到這了,更多相關(guān)JavaScript基本對(duì)象講解內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javaScript中兩個(gè)等于號(hào)和三個(gè)等于號(hào)之間的區(qū)別介紹
這篇文章主要介紹了javaScript中兩個(gè)等于號(hào)和三個(gè)等于號(hào)之間的區(qū)別,還不知道的朋友可以學(xué)習(xí)下2014-06-06
JavaScript DOM 學(xué)習(xí)第二章 編輯文本
在這一章我會(huì)給出一個(gè)在CMS里非常有用的更新頁(yè)面的代碼。在任一段落點(diǎn)擊鼠標(biāo)你就可以修改了。完成以后點(diǎn)擊按鈕,修改的文本就顯示了。2010-02-02
Javascript實(shí)現(xiàn)異步編程的過(guò)程
這篇內(nèi)容詳細(xì)分析了Javascript實(shí)現(xiàn)異步編程的過(guò)程以及原理解釋?zhuān)瑢?duì)此知識(shí)點(diǎn)有興趣的朋友可以學(xué)習(xí)下。2018-06-06
簡(jiǎn)介JavaScript中用于處理正切的Math.tan()方法
這篇文章主要介紹了簡(jiǎn)介JavaScript中用于處理正切的Math.tan()方法,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06

