上一小節(jié)講到了基本包裝類(lèi)型,本小節(jié)繼續(xù)補(bǔ)充面向?qū)ο蟮膬?nèi)容.有點(diǎn)多,有點(diǎn)雜.好像我每次都在強(qiáng)調(diào)耐心這個(gè)詞,確實(shí),沒(méi)有耐心是學(xué)不好技術(shù)的,如果講的不夠詳細(xì),大家又是似懂非懂的狀態(tài),這樣與你與我都不好 !
所以我會(huì)很耐心的去分享,希望讀者也有耐心去學(xué)習(xí)!
原型鏈 --- 繪圖展示
- 示例代碼 :
<script>
function Animal(){
}
function Dog(){
}
//設(shè)置原型鏈(原型)繼承
var a1 = new Animal();
Dog.prototype = a1;
var dog1 = new Dog();
console.log(Object.prototype.constructor);
var o = {};
console.log(o.constructor == Object.prototype.constructor);
console.log(Object.prototype.__proto__ == Object.prototype);
</script>
- 圖解 -- 更形象的展示原型鏈
**原型鏈 **
Object對(duì)象的補(bǔ)充點(diǎn)
- 創(chuàng)建基本包裝類(lèi)型的對(duì)象
- js中所有的對(duì)象都基于object,都繼承自object
- 示例代碼 :
<script>
var str1 = new String("demo01");
var str2 = new String("demo01");
var str3 = str1;
var str4 = "demo01";
//判斷是否相等
console.log(str1 == str2); //false(!!!!)
console.log(str1 == str4); //true(內(nèi)部會(huì)隱式轉(zhuǎn)換)
console.log(str1 === str2); //false
console.log(str1 === str3); //true
console.log(str1 === str4); //false
var num1 = new Number(10);
var num2 = 10;
var num3 = new Number(10);
console.log(num1 == num2); //true
console.log(num1 == num3); //false
</script>
Object.prototype詳解
- constructor:指向該對(duì)象的構(gòu)造函數(shù)
- hasOwnProperty:檢測(cè)對(duì)象中是否存在某個(gè)實(shí)例屬性
- isPrototypeOf:判斷某個(gè)對(duì)象是否是指定對(duì)象的原型對(duì)象(會(huì)判斷整條原型鏈)
-
propertyIsEnumerable:判斷該屬性是否是可枚舉
如果是可以枚舉的,那么在使用for..in循環(huán)的時(shí)候可以打印出來(lái) - toString 返回一個(gè)對(duì)當(dāng)前對(duì)象的字符串描述信息,并非一定是該對(duì)象的字符串形式
1.object類(lèi)型的對(duì)象 返回的什么 [obejct Object]
2.其他對(duì)象類(lèi)型如函數(shù) | 數(shù)組 ,返回對(duì)應(yīng)的字符串形式
3.Number類(lèi)型 可以傳遞參數(shù)(進(jìn)制) 不傳遞參數(shù):默認(rèn)是十進(jìn)制
- toLocaleString 大部分情況下的等價(jià)于toString方法，特殊情況下會(huì)做本地化處理
- valueOf 返回對(duì)應(yīng)的值
1.基本包裝類(lèi)型（String Number Boolean）,返回對(duì)應(yīng)的基本類(lèi)型的值
2.object類(lèi)型的钢猛，返回this(該對(duì)象本身)
3.date(日期類(lèi))蔬捷，返回時(shí)間戳
- 示例代碼1 :
<script>
function Person(){}
var obj = {name:"name"};
Person.prototype = obj; //替換原型對(duì)象
Person.constructor = Person;
var p1 = new Person();
console.log(obj.isPrototypeOf(p1)); //是原型對(duì)象
console.log(Object.prototype.isPrototypeOf(p1));
// true 整條原型鏈上面的原型對(duì)象都會(huì)進(jìn)行判斷
</script>
- 示例代碼2 :
<script>
var obj = {name:"張三",age:23};
//console.log(Object.getOwnPropertyDescriptor(obj, "name"));
//設(shè)置屬性
Object.defineProperty(obj,"age",{
enumerable:false,
});
for(var k in obj)
{
console.log(k, obj[k]);
}
</script>
- 示例代碼3 :
<script>
var o = {name:"dingding"};
console.log(o.toString()); //[obejct Object]
var arr = ["demo01","demo02","demo03"];
console.log(arr.toString()); //demo01,demo02,demo03
function demoTest(){};
// console.log(demoTest.toString()); //function demoTest(){}
var num = new Number(10);
console.log(num.toString()); //20
console.log(num.toString(2)); //二進(jìn)制 -- 1010 --- > 1 * 2*2*2 + 0 *2*2 + 1*2 + 0*1 = 8 + 0 + 2 + 0 = 10
console.log(num.toString(3)); //三進(jìn)制 -- 101 ---> 1*3*3 + 0 * 3 + 1 *1 = 9 + 0 + 1 = 10
console.log(num.toString(7)); //七進(jìn)制 -- 13 ---> 1 * 7 + 3*1 = 10
var str = new String("tese");
console.log(str.valueOf()); //tese
var o = {name:"jiji"};
console.log(o.valueOf());
var date = new Date(); //當(dāng)前的時(shí)間
console.log(date.valueOf()); //1488163624297 時(shí)間戳速侈，是一個(gè)絕對(duì)的值
</script>
Object的靜態(tài)成員和實(shí)例成員
實(shí)例成員
- 成員 : 屬性和方法
- 說(shuō)明 : 實(shí)力對(duì)象上面添加的屬性和方法
靜態(tài)成員
構(gòu)造函數(shù) : 本身也是對(duì)象苗缩，所以構(gòu)造函數(shù)自己也可以擁有屬性和方法，這些屬性和方法就是靜態(tài)成員
Object.apply --> 借用其它對(duì)象的函數(shù)
Object.arguments -->函數(shù)內(nèi)部的一個(gè)隱藏參數(shù)僵缺，主要用來(lái)接收實(shí)參寸五。
Object.assign --> 拷貝對(duì)象的屬性的
Object.bind --> 綁定處理（call和apply很像）
Object.call --> 借用其它對(duì)象的函數(shù)
Object.caller
某個(gè)函數(shù)的調(diào)用函數(shù)，返回的是一個(gè)函數(shù)
如果是在全局作用域中調(diào)用該方法锨苏，那么打印出來(lái)的是：null而不是windowObject.constructor --> 構(gòu)造器屬性疙教，指向該對(duì)象的構(gòu)造函數(shù)
Object.create --> 創(chuàng)建對(duì)象，并且設(shè)置原型對(duì)象
Object.getPrototypeOf --> 獲得某個(gè)對(duì)象的原型對(duì)象
Object.getOwnPropertyDescriptor
獲得對(duì)象中某個(gè)實(shí)例屬性的描述信息（是否可以配置伞租，枚舉贞谓，值，是否可以重寫(xiě)）
具體的描述信息如下：
1.configurable:true 是否是可以配置的（能不能刪除屬性或者是修改這個(gè)配置本身）
2.enumerable:true 是否是可以枚舉的（在for..in循環(huán)中是否能夠遍歷出來(lái)|keys()）
3.value:"zhangsan" 屬性對(duì)應(yīng)的值
4.writable:true 是否是可重寫(xiě)的
- Object.defineProperty 用來(lái)設(shè)置屬性的描述信息（修改已有的屬性|新增屬性）
1.修改已有的屬性葵诈，默認(rèn)情況下這三個(gè)值是true
2.新增加屬性 默認(rèn)情況下裸弦，這三個(gè)屬性的值都是false - 示例代碼 :
<script>
var obj = {};
//Object.defineProperty來(lái)新增屬性并且設(shè)置屬性的描述對(duì)象
Object.defineProperty(obj,"age",{
value:"100"
});
console.log(Object.getOwnPropertyDescriptor(obj, "age"));
</script>
- Object.getOwnPropertyNames
1.不包含原型屬性
2.獲得所有的實(shí)例屬性（名稱(chēng)），返回值是一個(gè)數(shù)組 - 示例代碼 :
<script>
var obj = {name:"zhangsan",age:78};
console.log(Object.getOwnPropertyNames(obj));
console.log(Object.getPrototypeOf(obj) == Object.prototype);
</script>
``
- **Object.keys --> 獲得對(duì)象的key 不包含原型屬性**
- **示例代碼 :**
```javascript
<script>
function Person(){
this.name = "momo"
};
Person.prototype.say = "say";
var p1 = new Person();
console.log(Object.keys(p1));
console.log(Object.getOwnPropertyNames(p1));
</script>
- Object.preventExtensions || Object.isExtensible --> 禁止對(duì)象擴(kuò)展作喘，默認(rèn)情況下對(duì)象可以動(dòng)態(tài)的增加屬性理疙，如果設(shè)置了禁止擴(kuò)展，那么將無(wú)法增加屬性
- 示例代碼 :
<script>
var o = {};
o.name = "names";
console.log(o);
Object.preventExtensions(o);
o.age = 30;
console.log(o);
</script>
- Object.seal 密封對(duì)象 --> 禁止刪除對(duì)象的屬性泞坦，禁止修改對(duì)象的配置信息configurable窖贤，禁止擴(kuò)展
- Object.freeze 凍結(jié)對(duì)象 --> 不能刪除屬性，不能增加屬性贰锁，也不能修改屬性
- 示例代碼 :
<script>
var obj = {des:"des"};
Object.freeze(obj);
obj.name = "momo";
obj.age = 20;
console.log(obj);
delete obj.des;
console.log(obj);
obj.des = "能不能修改";
console.log(obj);
</script>
- 或者你也可以打開(kāi)控制臺(tái)查看,都有! 想知道每個(gè)的功能可以一一去實(shí)驗(yàn)
- 圖解
**Object的靜態(tài)成員**
Function的構(gòu)造函數(shù)的使用
創(chuàng)建函數(shù)的幾種方法
- 函數(shù)聲明
- 函數(shù)表達(dá)式
- 示例代碼 :
<script>
function func01(){
//函數(shù)體
}
var func02 = function name(){}; //命名函數(shù)表達(dá)式
var func03 = function (){}; //匿名函數(shù)表達(dá)式
var func04 = new Function("console.log(\"1\");");
func04();
</script>
-
new Function
1.一個(gè)參數(shù)都沒(méi)有赃梧，那么創(chuàng)建的是一個(gè)空函數(shù)
2.有一個(gè)參數(shù)，這個(gè)參數(shù)作為新創(chuàng)建出來(lái)的函數(shù)的函數(shù)體
3.有多個(gè)參數(shù)豌熄，最后一個(gè)參數(shù)是新創(chuàng)建的函數(shù)的函數(shù)體授嘀，其它的參數(shù)是形參列表 - 示例代碼 :
<script>
// 操作符 + 拼接字符串的方式
var func = new Function("console.log(\"讓我掉下眼淚的，不是昨夜的酒\");" +
" console.log(\"讓我依依不舍的锣险，不止你的溫柔\");" +
"console.log(\"余路還要走多久蹄皱，我牽著你的手\");");
func();
</script>
- 示例代碼 : ---> 改進(jìn)
<script type="text/template" id="demo">
// 使用js模板來(lái)存放數(shù)據(jù)
console.log("讓我掉下眼淚的览闰，不是昨夜的酒");
console.log("讓我依依不舍的，不止你的溫柔");
console.log("余路還要走多久巷折，我牽著你的手");
</script>
<script>
var func = new Function(`
// 反括號(hào)``
console.log(\"讓我掉下眼淚的焕济，不是昨夜的酒\");
console.log(\"讓我依依不舍的，不止你的溫柔\");
console.log(\"余路還要走多久盔几，我牽著你的手\");`);
func();
</script>
<script>
var script = document.getElementById("demo");
var str = script.innerHTML;
var func = new Function(str);
func();
</script>
