摘要:一面向?qū)ο蟾攀雒嫦驅(qū)ο笫鞘裁词鞘褂靡幌盗袑ο笙嗷f(xié)作軟件設(shè)計,目的是在編程中促進(jìn)更好靈活性和可維護(hù)性,憑借對模塊化重視,面向?qū)ο蟠a開發(fā)更簡單,容易理解面向?qū)ο蟮挠兄饕卣魇欠庋b繼承多態(tài)封裝封裝主要用于敘述對象中所包含封裝的內(nèi)容,由兩部分組
JS(JavaScript)
一.面向?qū)ο螅?br>概述;
面向?qū)ο笫鞘裁矗?/p>
是使用一系列對象相互協(xié)作軟件設(shè)計,目的是在編程中促進(jìn)更好靈活性和可維護(hù)性,憑借對模塊化重視,面向?qū)ο蟠a開發(fā)更簡單,容易理解
面向?qū)ο蟮挠兄饕卣魇?.封裝;2.繼承;3.多態(tài)
封裝;
封裝主要用于敘述對象中所包含(封裝)的內(nèi)容,由兩部分組成
相關(guān)的數(shù)據(jù)(儲存屬性)
這些數(shù)據(jù)所能做的事情
繼承;
是指類和類之間的關(guān)系,如兩個類都有相同的屬性和方法,那么其中一個類并可以繼承另一個類,這樣不需要再次定義同樣的屬性和方法
創(chuàng)建一個或多個類專門類方式稱為繼承,有兩個類其中一個叫子類,另一個是叫做父類
多態(tài);
不同的對象可以定義有相同名稱方法,方法是作用所在對象中,不同對象相同方法調(diào)用各自行為能力則為多態(tài)
如A對象有sayMe()方法,B對象繼承A對象,而B對象也有具有sayMe()方法,sayMe()方法時,并不知道該方法A對象還是B對象,且不影響代碼正常工作
2.構(gòu)造函數(shù);
構(gòu)造函數(shù);
構(gòu)造函數(shù)稱為構(gòu)造器和對象模版是對象的一餓方法,構(gòu)造器被調(diào)用,在
JS(JavaScript)中函數(shù)可以作為構(gòu)造器使用,,并不需要定義個構(gòu)造器方法
構(gòu)造函數(shù)的屬性;
就是對象的變量,一個對象包含多個屬性,定義構(gòu)造函數(shù)屬性是使用this關(guān)鍵字
構(gòu)造函數(shù)的方法;
該方法,很想構(gòu)造函數(shù)屬性,不同是方法是個函數(shù)(或像函數(shù)一樣定義)定義構(gòu)造函數(shù)屬性是使用this關(guān)鍵字
this關(guān)鍵字
有套完全不同于其它語言對this處理機(jī)制,this關(guān)鍵字本身沒有任何意義
/* 用于創(chuàng)建對象(屬性和方法) function 構(gòu)造函數(shù)名稱(){ this.屬性名 = 屬性值; this.方法名 = function(){ 方法體 } } this關(guān)鍵字-指代利用當(dāng)前構(gòu)造函數(shù)創(chuàng)建的對象 */ function Hero(name){ this.name = name; this.sayMe = function(){ console.log("我是" + name); } } // 利用構(gòu)造函數(shù)創(chuàng)建對象 var hero = new Hero("犬夜叉"); console.log(hero); var obj = { name : "犬夜叉", sayMe : function(){ console.log("我是犬夜叉"); } }
二.Object類型;
1.操作對象的屬性;
設(shè)置屬性描述符value;
是該屬性所對應(yīng)值,可以是如何有效的JS(JavaScript)值(數(shù)值,對象,函數(shù))為默認(rèn)值undefined
var obj = { // 定義對象的同時定義了該屬性以及值(可修改、可刪除以及可枚舉的) name : "犬夜叉" } Object.defineProperty(obj, "name", { value : "桔梗" }); console.log(obj.name);// 桔梗 /* 同樣都是為對象新增屬性 1.如果直接使用 "對象名.屬性名 = 值" -> 可修改、可刪除以及可枚舉的 2.如果使用Object.defineProperty()方法新增屬性 * 該新屬性是不可修改、不可刪除以及不可枚舉的 */ Object.defineProperty(obj, "age", { value : 16 }); console.log(obj.age);// 16 var result1 = Object.getOwnPropertyDescriptor(obj, "age"); console.log(result1); // 一旦屬性的值是不可修改的 - 如果執(zhí)行修改操作時 -> 沒有語法報錯,但是無效 obj.age = 80; console.log(obj.age);// 16 obj.job = "妖狐"; var result2 = Object.getOwnPropertyDescriptor(obj, "job"); console.log(result2);
設(shè)置屬性描述符writable;
當(dāng)該屬性為true時,value才能被賦值運算符所改變,默認(rèn)為false
var obj = { // 定義對象的同時定義了該屬性以及值(可修改、可刪除以及可枚舉的) name : "犬夜叉" } // 修改現(xiàn)有屬性 Object.defineProperty(obj, "name", { value : "桔梗", writable : false // 不可修改 }); console.log(obj.name);// 桔梗 // 修改name屬性值 obj.name = "戈薇"; console.log(obj.name);// 桔梗 Object.defineProperty(obj, "age", { value : 18, writable : true }); console.log(obj.age);// 16 // 修改age屬性值 obj.age = 80; console.log(obj.age);// 80 // 刪除age屬性值 delete obj.age; console.log(obj.age);// undefined
設(shè)置屬性描述符configurable;
該屬性為true時,該屬性描述符才能改變,同時會從相同的對象中被刪除,默認(rèn)為false
var obj = { // 定義對象的同時定義了該屬性以及值(可修改、可刪除以及可枚舉的) name : "犬夜叉" } // 修改現(xiàn)有屬性 Object.defineProperty(obj, "name", { value : "桔梗", writable : true, // 控制當(dāng)前屬性是否可被修改 configurable : true // 控制當(dāng)前屬性是否可被刪除 }); console.log(obj.name);// 桔梗 // 修改name屬性值 obj.name = "戈薇"; console.log(obj.name);// 桔梗 // 刪除name屬性值 delete obj.name; console.log(obj.name);// 桔梗
設(shè)置屬性描述符enumerable;
該屬性為true時,屬性才能出現(xiàn)在對象枚舉屬性中,默認(rèn)為false
var obj = { // 定義對象的同時定義了該屬性以及值(可修改、可刪除以及可枚舉的) name : "犬夜叉" } Object.defineProperty(obj, "name", { value : "桔梗", enumerable : false }); console.log(obj.name);// 桔梗 /* 屬性描述符enumerable - 控制當(dāng)前屬性是否可被枚舉(遍歷) * 僅能循環(huán)遍歷對象中可被枚舉的屬性 * for...in語句 * keys()方法 * 可以循環(huán)遍歷對象中可被枚舉和不可被枚舉的屬性 * getOwnPropertyNames()方法 */ for (var i in obj) { console.log(i); } var result1 = Object.keys(obj); console.log(result1); var result2 = Object.getOwnPropertyNames(obj); console.log(result2);
屬性描述符設(shè)置方法
var obj = { sayMe : function(){ console.log("this is function"); } } var result = Object.getOwnPropertyDescriptor(obj, "sayMe"); console.log(result); Object.defineProperty(obj, "sayMe", { value : function(){ console.log("this is new function"); }, writable : false }); obj.sayMe(); obj.sayMe = function(){ console.log("這是犬夜叉"); } obj.sayMe();
屬性描述符存取器
var obj = { name : "犬夜叉" } var value;// 全局變量 Object.defineProperty(obj,"name",{// 當(dāng)獲取或訪問當(dāng)前屬性時,會調(diào)用get方法 get : function () { // 獲取指定的屬性值 console.log("Inuyasha"); /* get方法在被調(diào)用時,不能傳遞任何參數(shù) get方法在被調(diào)用時,允許傳遞this關(guān)鍵字 this - 表示當(dāng)前的目標(biāo)對象(不能調(diào)用對象的當(dāng)前目標(biāo)屬性) */ return value;// 由于變量為初始化,調(diào)用時可能結(jié)果為 undefined }, set : function (newValue) { console.log("Inuyasha: " + value); value = newValue; /* set方法在被調(diào)用時,允許傳遞this關(guān)鍵字 this - 表示當(dāng)前的目標(biāo)對象(不能調(diào)用對象的當(dāng)前目標(biāo)屬性) */ } }) console.log(obj.name);// undefined obj.name = "桔梗"; console.log(obj.name);//桔梗
2.防篡改對象;
禁止擴(kuò)展
Object.preventExtensions()表示對象不可擴(kuò)展,不能新增屬性和方法
Object.isExtensible()表示判斷是否可擴(kuò)展
var obj = {}; // 將對象設(shè)置禁止擴(kuò)展 Object.preventExtensions(obj); // 新增屬性或方法無效 -> 語法沒有報錯 obj.name = "犬夜叉"; console.log(obj); /* Object.defineProperty()方法新增屬性 * 結(jié)果 - 報錯 * 信息 - TypeError: Cannot define property:name, object is not extensible. */ Object.defineProperty(obj, "name", { value : "桔梗" }); console.log(obj); /* Object.isExtensible(obj)方法 * 作用 - 用于判斷指定目標(biāo)對象是否可擴(kuò)展 * 返回值 * true - 表示指定目標(biāo)對象是可擴(kuò)展的 * false - 表示指定目標(biāo)哦對象是不可擴(kuò)展的 */ var result = Object.isExtensible(obj); console.log(result);
密封對象
Object.seal()表示封閉個對象,阻止增加新屬性,現(xiàn)有屬性不可設(shè)置,
Object.isSealed()判斷個對象是否密封
var obj = { name : "犬夜叉" // 表示可修改 }; console.log(Object.getOwnPropertyDescriptor(obj, "name")); /* 將該對象進(jìn)行密封 1.不能為該對象新增屬性或方法 2.不能修改該對象的屬性或方法的描述符 * configurable * enumerable */ Object.seal(obj); console.log(Object.getOwnPropertyDescriptor(obj, "name")); /*Object.defineProperty(obj, "age", { value : 16 });*/ Object.defineProperty(obj, "name", { value : "桔梗", writable : false, // 表示不可修改 configurable : true, enumerable : false }); console.log(Object.getOwnPropertyDescriptor(obj, "name")) console.log(obj); obj.name = "戈薇"; console.log(obj);
凍結(jié)對象
Object.freeze()凍結(jié)個對象,不能增加新屬性給該對象,也不能修改此屬性值,已有屬性不能刪除,也不能修改此對象的屬性,該方法返回被凍結(jié)對象
Object.isFrozen()判斷個對象是否被凍結(jié)
var obj = { name : "犬夜叉" } // 凍結(jié)對象 Object.freeze(obj); /*obj.age = 16; console.log(obj); obj.name = "桔梗"; console.log(obj); delete obj.name; console.log(obj);*/ Object.defineProperty(obj, "age", { value : 16 }); console.log(obj);
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/108200.html
摘要:很多情況下,通常一個人類,即創(chuàng)建了一個具體的對象。對象就是數(shù)據(jù),對象本身不包含方法。類是相似對象的描述,稱為類的定義,是該類對象的藍(lán)圖或原型。在中,對象通過對類的實體化形成的對象。一類的對象抽取出來。注意中,對象一定是通過類的實例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個人類,即創(chuàng)建了一個具體的對象。對象就是數(shù)據(jù),對象本身不包含方法。類是相似對象的描述,稱為類的定義,是該類對象的藍(lán)圖或原型。在中,對象通過對類的實體化形成的對象。一類的對象抽取出來。注意中,對象一定是通過類的實例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個人類,即創(chuàng)建了一個具體的對象。對象就是數(shù)據(jù),對象本身不包含方法。類是相似對象的描述,稱為類的定義,是該類對象的藍(lán)圖或原型。在中,對象通過對類的實體化形成的對象。一類的對象抽取出來。注意中,對象一定是通過類的實例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:是完全的面向?qū)ο笳Z言,它們通過類的形式組織函數(shù)和變量,使之不能脫離對象存在。而在基于原型的面向?qū)ο蠓绞街?,對象則是依靠構(gòu)造器利用原型構(gòu)造出來的。 JavaScript 函數(shù)式腳本語言特性以及其看似隨意的編寫風(fēng)格,導(dǎo)致長期以來人們對這一門語言的誤解,即認(rèn)為 JavaScript 不是一門面向?qū)ο蟮恼Z言,或者只是部分具備一些面向?qū)ο蟮奶卣鳌1疚膶⒒貧w面向?qū)ο蟊疽?,從對語言感悟的角度闡述為什...
摘要:用代碼可以這樣描述安全到達(dá)國外面向過程既然說了面向?qū)ο?,那么與之對應(yīng)的就是面向過程。小結(jié)在這篇文章中,介紹了什么是面向?qū)ο蠛兔嫦蜻^程,以及中對象的含義。 這是 javascript 面向?qū)ο蟀鎵K的第一篇文章,主要講解對面向?qū)ο笏枷氲囊粋€理解。先說說什么是對象,其實這個還真的不好說。我們可以把自己當(dāng)成一個對象,或者過年的時候相親,找對象,那么你未來的老婆也是一個對象。我們就要一些屬性,比...
摘要:之前,本質(zhì)上不能算是一門面向?qū)ο蟮木幊陶Z言,因為它對于封裝繼承多態(tài)這些面向?qū)ο笳Z言的特點并沒有在語言層面上提供原生的支持。所以在中出現(xiàn)了等關(guān)鍵字,解決了面向?qū)ο笾谐霈F(xiàn)了問題。 ES6之前,javascript本質(zhì)上不能算是一門面向?qū)ο蟮木幊陶Z言,因為它對于封裝、繼承、多態(tài)這些面向?qū)ο笳Z言的特點并沒有在語言層面上提供原生的支持。但是,它引入了原型(prototype)的概念,可以讓我們以...
閱讀 3466·2023-04-26 00:39
閱讀 4073·2021-09-22 10:02
閱讀 2555·2021-08-09 13:46
閱讀 1108·2019-08-29 18:40
閱讀 1455·2019-08-29 18:33
閱讀 781·2019-08-29 17:14
閱讀 1523·2019-08-29 12:40
閱讀 2983·2019-08-28 18:07