JavaScript對象內(nèi)置對象,值類型和引用類型講解

更新時間：2021年06月22日 10:37:03 作者：開到荼蘼223''''''''s

本文講述了JavaScript的一些對象，值的類型和引用類型的講解，詳細(xì)的使用圖文進(jìn)行說明歸納和整理

對象

JS中的對象是屬性和行為的結(jié)合體，其中屬性是對象的靜態(tài)特征，行為又稱方法，是對象的動態(tài)特征。

JavaScript中的對象主要分為三大類：

內(nèi)置對象

由ES標(biāo)準(zhǔn)中定義的對象在任何的ES的實現(xiàn)中都可以使用，比如Math String Number Boolean Function Object

宿主對象

由JS的運(yùn)行環(huán)境提供的對象，目前來講主要是瀏覽器提供的對象，比如BOM DOM

自定義對象

由開發(fā)人員自己創(chuàng)建的對象

對象的定義

定義非空對象

// 非空對象：
var 對象名 = {
	屬性名： 值,
	...
	方法名: function([參數(shù)]){
		方法體語句;
	}
	...
}

var p1 = {
	color: '黑色',//給對象添加屬性
	weight: '188g',//屬性之間用逗號隔開
	screenSize: 6.5,
	call: function(name){//給對象添加方法
		console.log("打出電話："+name);
	},
	sendMassage: function(msg){
		console.log("發(fā)出的信息是："+msg);
	},
	playVideo: function(){
		console.log("播放視頻");
	},
	playMusic: function(){
		console.log("播放音樂");
	}
}
console.log("手機(jī)顏色:"+p1['color']);//也可以使用 對象['屬性']來輸出屬性值
console.log("手機(jī)重量:"+p1.weight);
console.log("屏幕尺寸:"+p1.screenSize);
p1.call("張三");//調(diào)用對象的發(fā)方法
p1["sendMassage"]("helo");
p1.playVideo();
p1.playMusic();
console.log(p1);

使用new Object()創(chuàng)建對象

var p = new Object(); // 創(chuàng)建一個空對象p

p2.name = '劉備';
p2.sex = '男';
p2.age = 32;
p2.sayHello = function(){
	console.log('Hello');
}
p2.sayHello();//調(diào)用對象的方法

可以使用構(gòu)造函數(shù)來創(chuàng)建對象：
語法： new 構(gòu)造函數(shù)名( )

function Student(name,sex,age){
	this.name = name;//這里的this指向的是構(gòu)造函數(shù)新創(chuàng)建的對象
	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)建的新對象 即實例
s1.show();
var s2 = new Student('段譽(yù)','男',23);
s2.show();

注意："構(gòu)造函數(shù)"可以有參數(shù)，也可以沒有參數(shù)，如果沒有參數(shù)小括號可以省略

遍歷對象的成員

遍歷對象的屬性和方法：使用for…in循環(huán)

for(var 變量名 in 對象名){
	循環(huán)語句
}

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是要遍歷的對象
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)算符
判斷成員(屬性)在對象中是否存在，存在返回true;不存在返回false。

JS內(nèi)置對象

JavaScript提供了很多常用的內(nèi)置對象，包括數(shù)學(xué)對象Math、日期對象Date、數(shù)組對象Array以及字符串對象String等。

Math對象

Math對象：用來對數(shù)字進(jìn)行與數(shù)學(xué)相關(guān)的運(yùn)算，不需要實例化對象，可以直接使用其靜態(tài)屬性和靜態(tài)方法.

Math對象:不需要實例化
Math.PI:算數(shù)常量PI
Math.abs(x):返回x的絕對值
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):返回一個小于等于x 并且與它最接近的整數(shù)
Math.ceil(x):返回一個大于等于x 并且與它最接近的整數(shù)

Date對象

Date對象：需要使用new Date()實例化對象才能使用，創(chuàng)建一個對象 Date()是一個構(gòu)造函數(shù)，可以給該構(gòu)造函數(shù)傳遞參數(shù)生成一個日期對象。

在這里插入圖片描述

// 1.創(chuàng)建一個Date對象 沒有參數(shù)
var date1 = new Date();
console.log(date1);
// 2.傳入年 月 日 時 分 秒 創(chuàng)建一個指定日期時間的Date對象
// 月份是 0-11
var date2 = new Date(2021,4,22,10,17,55);
console.log(date2);
// 3.傳入一個日期和時間字符串創(chuàng)建一個Date對象
var date3 = new Date("2021-5-22 18:19:25");
console.log(date3);
console.log(date3.getMonth())//4
console.log(date3.getTime())//表示Date對象距離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ù)組對象

數(shù)組：是一些類型相同的數(shù)據(jù)的集合，它和普通的對象功能類似，也是用來存儲一些值，數(shù)組是使用數(shù)字來作為索引操作內(nèi)部的元素。
數(shù)組的創(chuàng)建

使用字面量

var arr=[]//創(chuàng)建一個空數(shù)組

使用new Array創(chuàng)建

var arr = new Array();//定義一個空數(shù)組

判斷一個對象是不是數(shù)組的兩種方法：

isArray(對象名)

instanceof: 對象名 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對象

String對象:字符串對象，必須使用new String()來創(chuàng)建

字符串常用方法

- charAt(n) 返回n位置上的字符串
- concat(s1,s2,...) 連接多個字符串
- charCodeAt(n) 返回n位置上的ASCII碼
- split('分隔符') 將字符串按給定的分隔符 轉(zhuǎn)換成字符串?dāng)?shù)組
- substr(start,length) 從start開始提取length個字符構(gòu)成一個新串
- substring(from,to) 提取from和to之間的字符串構(gòu)成一個新串
- toLowerCase() 將串中的大寫字符轉(zhuǎn)換成小寫 不影響原字符串 返回一個新字符串
- toUpperCase() 將串中的所有小寫轉(zhuǎn)換成大寫 不影響原字符串 返回一個新字符串
- replace(str1,str2) 使用str2替換字符串中的str1 返回替換結(jié)果 不影響原字符串

字符串對象練習(xí)

// 輸入一個由字母組成的字符串,統(tǒng)計串中每個字母出現(xiàn)的次數(shù)
var str = 'abBSdXbdea';
var lower = new Array(26);// 存放26個小寫字母各自出現(xiàn)的次數(shù)
var upper = new Array(26);// 存放26個大寫字母各自出現(xiàn)的次數(shù)
// 初始化兩個數(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);

/* 輸入一個十進(jìn)制整數(shù)和一個數(shù)制（2、8、16）將該十進(jìn)制整數(shù)轉(zhuǎn)換成
        對應(yīng)的數(shù)值格式輸出
            取余法：
               m=15 k=8
               m%k 將余數(shù)存放在數(shù)組中
        */
        var m = parseInt(prompt('請輸入一個整數(shù)：'));
        var k = parseInt(prompt('請輸入一個數(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){//對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);

值類型和引用類型

值類型: 簡單的數(shù)據(jù)類型(字符串,數(shù)值型,布爾型,undefined,null)
引用類型: 復(fù)雜數(shù)據(jù)類型(對象) 變量中保存的是引用的地址

注意： 引用類型的特點是，變量中保存的僅僅是一個引用的地址，當(dāng)對變量進(jìn)行賦值時，并不是將對象復(fù)制了一份，而是將兩個變量指向了同一個對象的引用。

下面對內(nèi)存中的棧和堆進(jìn)行分析
棧(stack)：會自動分配內(nèi)存空間，會自動釋放，簡單數(shù)據(jù)類型存放到棧里面。
堆(heap)：動態(tài)分配的內(nèi)存，大小不定也不會自動釋放，復(fù)雜數(shù)據(jù)類型存放到堆里面。

在這里插入圖片描述