javascript_javascript スキルにおけるプロトタイプの継承に関する簡単な説明

ソース コードを参照してください:

コードをコピー コードは次のとおりです:

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

ext を見てみる(4.1 の 1896 行目から) プロトタイプの継承。

コードをコピー コードは次のとおりです。

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

ここでオブジェクトのプロトタイプがクリアされます。
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 を使用して実行できますが、考え方は同じです。

Situ Zhengmei の質量にも、lang_fix.js の 17 行目に同様の継承があります:

コードをコピー コードは次のとおりです。 :

create: function(o){

if (arguments.length > 1) {
$.log(" Object.create 実装は最初のパラメーターのみを受け入れます。")
}
function F() {}
F.prototype = o;
return new F();


es5 の正式バージョンを確認する、互換性パッチを見つけました:

コードをコピー コードは次のとおりです: // ES5 15.2 .3.5

// http://es5.github.com/#x15.2.3.5

if (!Object.create) {
Object.create = function create(prototype,properties) {
var オブジェクト;
if (プロトタイプ === null) {
オブジェクト = { "__proto__": null };
} else {
if (プロトタイプ != "オブジェクト") {
throw new TypeError("typeofprototype[" (typeofprototype) "] != 'object'");
var Type = function () {}; prototype ;
object = new Type();
// IE には `Object.getPrototypeOf` の組み込み実装がありません
// `__proto__` もありませんが、これを手動で設定すると
// `Object.getPrototypeOf` が
で期待どおりに動作することを保証します。// `Object.create` を使用して作成されたオブジェクト
object.__proto__ =
}
if (properties !== void 0) {
Object.defineProperties(object,properties);
}
}


上記のコードは相対的に考慮されます包括的ですが、Object.defineProperties への追加パッチの導入が必要で、ソース コードは比較的大きくなります。




コードをコピー

コードは次のとおりです:

// ES5 15.2.3.6
// http://es5.github.com/#x15.2.3.6
// WebKit および IE8 標準モード用のパッチ
// hax によって設計されました。
// 関連する問題: https://github.com/kriskowal/es5-shim/issues#issue/5
// IE8 リファレンス:
// http://msdn.microsoft.com/ en-us/library/dd282900.aspx
// http://msdn.microsoft.com/en-us/library/dd229916.aspx
// WebKit のバグ:
// https:// bugs.webkit.org/show_bug.cgi?id=36423
function dosDefinePropertyWork(object) {
try {
Object.defineProperty(object, "sentinel", {});
オブジェクトの「センチネル」を返します。
} catch (例外) {
// false を返します
}
}
// 指定されている場合、defineProperty が機能するかどうかを確認します。それ以外の場合、
// 部分的にシムします。
if (Object.defineProperty) {
var definePropertyWorksOnObject = dosDefinePropertyWork({});
var definePropertyWorksOnDom = ドキュメントの種類 == "未定義" ||
doesDefinePropertyWork(document.createElement("div"));
if (!definePropertyWorksOnObject || !definePropertyWorksOnDom) {
vardefinePropertyFallback = Object.defineProperty;
}
}
if (!Object.defineProperty || definePropertyFallback) {
var ERR_NON_OBJECT_DESCRIPTOR = "プロパティの説明はオブジェクトである必要があります: ";
var ERR_NON_OBJECT_TARGET = "非オブジェクトで呼び出された Object.defineProperty: "
var ERR_ACCESSORS_NOT_SUPPORTED = "この JavaScript エンジンではゲッターとセッターを定義できません "
";
Object.defineProperty = function defineProperty(object, property, descriptor) {
if ((typeof object != "object" && typeof object != "function") || object === null) {
新しい TypeError(ERR_NON_OBJECT_TARGET オブジェクト) をスローします。
}
if ((記述子のタイプ != "オブジェクト" && 記述子のタイプ != "関数") || 記述子 === null) {
throw new TypeError(ERR_NON_OBJECT_DESCRIPTOR 記述子);
}
// I8 の DOM 要素に対して実際のdefineProperty
// を使用するという勇敢な試みを行ってください。
if (definePropertyFallback) {
try {
return definePropertyFallback.call(Object, object, property, descriptor);
} catch (例外) {
// 実際のシムが機能しない場合は shim を試します
}
}
// データ プロパティの場合。
if (owns(descriptor, "value")) {
// "writable"、"enumerable"、または "configurable" の場合はサイレントに失敗します
// 要求されたがサポートされていません
/*
// 代替アプローチ:
if ( // これらの機能は実装できません。false は許可しますが、true は許可しません
!(owns(descriptor, "writable") ? descriptor.writable : true) ||
!(owns(descriptor, "enumerable") ? descriptor.enumerable : true) ||
!(owns(descriptor, "configurable") ? descriptor.configurable : true)
)
throw new RangeError(
「Object.defineProperty のこの実装は、"
"構成可能、列挙可能、または書き込み可能をサポートしていません。"
);
*/
if (supportsAccessors && (lookupGetter(object, property) ||
lookupSetter(object, property)))
{
// アクセサーは // `__proto__` は、継承された
// アクセサーにヒットしないようにするためのプロパティを定義する際に、安全に `__proto__` をオーバーライドできます。
var プロトタイプ = object.__proto__;
object.__proto__ = プロトタイプのオブジェクト;
// getter / setter がオブジェクト自体に定義されている可能性があるため、とにかくプロパティを削除します。
//
オブジェクト[プロパティ]を削除します。
オブジェクト[プロパティ] = 記述子.値;
// 元の `__proto__` を設定します。
object.__proto__ = プロトタイプ;
} else {
オブジェクト[プロパティ] = 記述子.値;
}
} else {
if (!supportsAccessors) {
throw new TypeError(ERR_ACCESSORS_NOT_SUPPORTED);
}
// ここまで進めば、ゲッターとセッターを定義できるようになります。
if (owns(descriptor, "get")) {
defineGetter(object, property, descriptor.get);
}
if (owns(descriptor, "set")) {
defineSetter(object, property, descriptor.set);
}
}
オブジェクトを返します。
};
}
// ES5 15.2.3.7
// http://es5.github.com/#x15.2.3.7
if (!Object.defineProperties) {
オブジェクト。 defineProperties = function defineProperties(object,properties) {
for (プロパティの var プロパティ) {
if (owns(properties, property) && property != "__proto__") {
Object.defineProperty(object,プロパティ、プロパティ[プロパティ]);
}
}
オブジェクトを返します。
};
}


EcmaScript6 のクラス継承。

class module extends Base {
constructor() {

} } 越玩越像java了，不过es6很多浏览器还不サポート 最終推荐的書法:

代制


代次:

if (!Object.create) {
Object.create = function create(o) {
var F = function(){};
F.プロトタイプ = o;
var result = new F();
F.prototype = null;
結果を返します。
}
}