在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ 淺談 javascript 的原型繼承
淺談 JavaScript 之事件綁定
淺談 javascript 中字符串 String 與數(shù)組 Array
淺談 javascript 中基本包裝類型
淺談 JavaScript Math 和 Number 對(duì)象
淺談 Javascript 的靜態(tài)屬性和原型屬性
淺談 JavaScript 中定義變量時(shí)有無(wú) var 聲明的區(qū)別
淺談 JavaScript Array 對(duì)象
淺談 JavaScript 函數(shù)參數(shù)的可修改性問(wèn)題
淺談 javascript 中的 instanceof 和 typeof
淺談 JavaScript 中 Date (日期對(duì)象),Math 對(duì)象
淺談 Javascript 執(zhí)行順序
淺談 javascript 函數(shù)屬性和方法
淺談 JavaScript 中面向?qū)ο蠹夹g(shù)的模擬
淺談 javascript 的原型繼承
淺談 javascript 事件取消和阻止冒泡
根據(jù)一段代碼淺談 Javascript 閉包
淺談 Javascript 面向?qū)ο缶幊?/span>
淺談 javascript 六種數(shù)據(jù)類型以及特殊注意點(diǎn)
淺談 Javascript 變量作用域問(wèn)題
淺談 javascript 函數(shù)內(nèi)部屬性
淺談 javascript 中自定義模版
淺談 JavaScript 字符集
淺談 javascript 面向?qū)ο缶幊?/span>
淺談 JavaScript 框架分類
淺談 JavaScript 中的 Math.atan() 方法的使用
淺談 Javascript 數(shù)組與字典
淺談 JavaScript 數(shù)據(jù)類型及轉(zhuǎn)換
淺談 javascript 的調(diào)試
淺談 Javascript 嵌套函數(shù)及閉包
淺談 javascript 回調(diào)函數(shù)
淺談 JavaScript Date 日期和時(shí)間對(duì)象
淺談 Javascript 中的 Function 與 Object
淺談 JavaScript 數(shù)據(jù)類型
淺談 javascript 中 this 在事件中的應(yīng)用
淺談 javascript 中的閉包
淺談 javascript 函數(shù)劫持
淺談 Javascript 中深復(fù)制
淺談 JavaScript 函數(shù)節(jié)流
淺談 JavaScript 中的 String 對(duì)象常用方法
淺談 JavaScript 事件的屬性列表
淺談 JavaScript 函數(shù)與棧
淺談 JavaScript 的事件
淺談 javascript 中的作用域
淺談 JavaScript 的執(zhí)行效率
淺談 Javascript 事件模擬
淺談 JavaScript function 函數(shù)種類
淺談 javascript 歸并方法
淺談 javascript 迭代方法
淺談 JavaScript 編程語(yǔ)言的編碼規(guī)范
淺談 JavaScript 實(shí)現(xiàn)面向?qū)ο笾械念?/span>
淺談 Javascript 鼠標(biāo)和滾輪事件
淺談 Javascript Base64 加密解密
淺談 Javascript 中勻速運(yùn)動(dòng)的停止條件
淺談 javascript 實(shí)現(xiàn)八大排序
淺談 javascript 的分號(hào)的使用
淺談 javascript 中 createElement 事件
淺談 javascript 的數(shù)據(jù)類型檢測(cè)
淺談 javascript 對(duì)象模型和 function 對(duì)象
淺談 Javascript 如何實(shí)現(xiàn)勻速運(yùn)動(dòng)
淺談 JavaScript 字符串與數(shù)組
淺談 javascript 面向?qū)ο蟪绦蛟O(shè)計(jì)
淺談 Javascript 事件處理程序的幾種方式

淺談 javascript 的原型繼承

請(qǐng)看源碼:

function clone(o) {   
var F = function(){};   
F.prototype = o;   
return new F();   
}  

首先看 ext(4.1 的 1896 行開(kāi)始)的原型式繼承。

var TemplateClass = function(){};   
var ExtObject = Ext.Object = {   
chain: function (object) {   
TemplateClass.prototype = object;   
var result = new TemplateClass();   
TemplateClass.prototype = null;   
return result;   
}   
}  

這里清除了 object 的 prototype。

再看一下 jquery 是怎么玩的繼承。

var jQuery = function(selector, context) {   
return new jQuery.fn.init(selector, context, rootjQuery);   
};   
-----------------------   
jQuery.fn = jQuery.prototype = {   
constructor: jQuery,   
init: function(selector, context, rootjQuery) {   
-----------------------   
}   
}   
-------------------   
jQuery.fn.init.prototype = jQuery.fn;  

jquery 玩的就比較高,借助 jQuery.fn.init 來(lái)完成,但是思路一樣。

司徒正美的 mass 里也有類似的繼承,在 lang_fix.js 里面第 17 行:

create: function(o){   
if (arguments.length> 1) {   
$.log("Object.create implementation only accepts the first parameter.")   
}   
function F() {}   
F.prototype = o;   
return new F();   
}  

查看了一下 es5 的官方,找到了他的兼容補(bǔ)?。?

// ES5 15.2.3.5   
// <a >http://es5.github.com/#x15.2.3.5</a>   
if (!Object.create) {   
Object.create = function create(prototype, properties) {   
var object;   
if (prototype === null) {   
object = { "__proto__": null };   
} else {   
if (typeof prototype != "object") {   
throw new TypeError("typeof prototype["+(typeof prototype)+"] !='object'");   
}   
var Type = function () {};   
Type.prototype = prototype;   
object = new Type();   
// IE has no built-in implementation of `Object.getPrototypeOf`   
// neither `__proto__`, but this manually setting `__proto__` will   
// guarantee that `Object.getPrototypeOf` will work as expected with   
// objects created using `Object.create`   
object.__proto__ = prototype;   
}   
if (properties !== void 0) {   
Object.defineProperties(object, properties);   
}   
return object;   
};   
}  

上面的代碼考慮的就比較全面,但是需要另外引入 Object.defineProperties 的補(bǔ)丁才行,源碼相對(duì)就比較多了。

// ES5 15.2.3.6   
// <a >http://es5.github.com/#x15.2.3.6</a>   
// Patch for WebKit and IE8 standard mode   
// Designed by hax <hax.github.com>   
// related issue: <a >https://github.com/kriskowal/es5-shim/issues#issue/5</a>   
// IE8 Reference:   
// <a >http://msdn.microsoft.com/en-us/library/dd282900.aspx</a>   
// <a >http://msdn.microsoft.com/en-us/library/dd229916.aspx</a>   
// WebKit Bugs:   
// <a >https://bugs.webkit.org/show_bug.cgi?id=36423</a>   
function doesDefinePropertyWork(object) {   
try {   
Object.defineProperty(object, "sentinel", {});   
return "sentinel" in object;   
} catch (exception) {   
// returns falsy   
}   
}   
// check whether defineProperty works if it's given. Otherwise,   
// shim partially.   
if (Object.defineProperty) {   
var definePropertyWorksOnObject = doesDefinePropertyWork({});   
var definePropertyWorksOnDom = typeof document == "undefined" ||   
doesDefinePropertyWork(document.createElement("div"));   
if (!definePropertyWorksOnObject || !definePropertyWorksOnDom) {   
var definePropertyFallback = Object.defineProperty;   
}   
}   
if (!Object.defineProperty || definePropertyFallback) {   
var ERR_NON_OBJECT_DESCRIPTOR = "Property description must be an object:";   
var ERR_NON_OBJECT_TARGET = "Object.defineProperty called on non-object:"   
var ERR_ACCESSORS_NOT_SUPPORTED = "getters & setters can not be defined" +   
"on this javascript engine";   
Object.defineProperty = function defineProperty(object, property, descriptor) {   
if ((typeof object != "object" && typeof object != "function") || object === null) {   
throw new TypeError(ERR_NON_OBJECT_TARGET + object);   
}   
if ((typeof descriptor != "object" && typeof descriptor != "function") || descriptor === null) {   
throw new TypeError(ERR_NON_OBJECT_DESCRIPTOR + descriptor);   
}   
// make a valiant attempt to use the real defineProperty   
// for I8's DOM elements.   
if (definePropertyFallback) {   
try {   
return definePropertyFallback.call(Object, object, property, descriptor);   
} catch (exception) {   
// try the shim if the real one doesn't work   
}   
}   
// If it's a data property.   
if (owns(descriptor, "value")) {   
// fail silently if "writable", "enumerable", or "configurable"   
// are requested but not supported   
/*  
// alternate approach:  
if (// can't implement these features; allow false but not true  
!(owns(descriptor,"writable") ? descriptor.writable : true) ||  
!(owns(descriptor,"enumerable") ? descriptor.enumerable : true) ||  
!(owns(descriptor,"configurable") ? descriptor.configurable : true)  
)  
throw new RangeError(  
"This implementation of Object.defineProperty does not" +  
"support configurable, enumerable, or writable."  
);  
*/   
if (supportsAccessors && (lookupGetter(object, property) ||   
lookupSetter(object, property)))   
{   
// As accessors are supported only on engines implementing   
// `__proto__` we can safely override `__proto__` while defining   
// a property to make sure that we don't hit an inherited   
// accessor.   
var prototype = object.__proto__;   
object.__proto__ = prototypeOfObject;   
// Deleting a property anyway since getter / setter may be   
// defined on object itself.   
delete object[property];   
object[property] = descriptor.value;   
// Setting original `__proto__` back now.   
object.__proto__ = prototype;   
} else {   
object[property] = descriptor.value;   
}   
} else {   
if (!supportsAccessors) {   
throw new TypeError(ERR_ACCESSORS_NOT_SUPPORTED);   
}   
// If we got that far then getters and setters can be defined !!   
if (owns(descriptor, "get")) {   
defineGetter(object, property, descriptor.get);   
}   
if (owns(descriptor, "set")) {   
defineSetter(object, property, descriptor.set);   
}   
}   
return object;   
};   
}   
// ES5 15.2.3.7   
// <a >http://es5.github.com/#x15.2.3.7</a>   
if (!Object.defineProperties) {   
Object.defineProperties = function defineProperties(object, properties) {   
for (var property in properties) {   
if (owns(properties, property) && property != "__proto__") {   
Object.defineProperty(object, property, properties[property]);   
}   
}   
return object;   
};   
}  

EcmaScript6 的類繼承。 
[js] view plaincopy
class module extends Base {   
constructor() {   
}   
}  

越玩越像 java 了,不過(guò) es6 很多瀏覽器還不支持。

最后推薦的寫(xiě)法:

if (!Object.create) {   
Object.create = function create(o) {   
var F = function(){};   
F.prototype = o;   
var result = new F();   
F.prototype = null;   
return result;   
}   
}