JavaScript オブジェクトの拡張はよく使用される function_javascript スキルです

通常、パラメータ オブジェクトのデフォルト値は関数で指定されます。このとき、
コード:

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

giant.ui.imageshow = function(options) {
this.opts = $ .extend({}, Giant .ui.imageshow.defaults, options);
}
giant.ui.imageshow.defaults = {
id:"imageshow",
isAuto:true,
speed:3000
};

Jquery フレームワークは拡張ツールを提供します:
jQuery.extend(target,obj1,[objN])
1 つでオブジェクトを拡張しますまたはその他のオブジェクト オブジェクト、展開されたオブジェクトを返します。
継承を簡素化するために使用されます。
1 つのオブジェクトを 1 つ以上の他のオブジェクトで拡張し、元の変更されたオブジェクトを返します。
これは、単純な継承に最適なユーティリティです。
戻り値--オブジェクト
パラメータ
ターゲット (オブジェクト) ): 変更するオブジェクト。
object1 (オブジェクト): 最初のオブジェクトにマージされるオブジェクト。
objectN (オブジェクト): (オプション) 最初のオブジェクトにマージされるオブジェクト。
しかし、フレームワークに組み込まれている拡張には明らかな欠陥があります。それは、オブジェクト内のオブジェクトを継承できないということです。例を挙げて説明します。
コード:

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

var obj1 = {},
var obj2={name:"karry",email:"karry@a.com",tel:{homeTel:"158255",officeTel:"02112585"}}
obj1 = $.extend({},obj1,obj2);

結果は、obj1 には name 属性と email 属性のみがあり、tel 自体はオブジェクトであり、tel 内の homeTel と officeTel は継承されません。
私の目標は、サブオブジェクトのネストがどれほど深くても、サブオブジェクトのサブプロパティをコピー (継承) する機能を実現することです。
まず、このメソッドのパラメータを見てみましょう。 target ターゲット オブジェクト、source ソース オブジェクト、deep が true の場合、オブジェクト内のオブジェクトをコピー (継承) するかどうかの 3 つのパラメータがあります。 inherit all、falseの場合はjquery実装と同様に子オブジェクトは継承されません。
コード:

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

Object.extend = function(target , /*optional*/source, /*optional*/deep) {}

最初のパラメータ target のみを必須パラメータとして設定し、source と deep は両方ともオプションのパラメータです。 。これを使用するときに 2 つのパラメーターのみが渡される場合、2 番目のパラメーターが対応するソースであるかディープであるかを確認するにはどうすればよいでしょうか。そのため、渡される 2 番目のパラメーターの型を判断する必要があります。
コード:

コードをコピー コードは次のとおりです。 | {} ; //ターゲットはデフォルトでは空ですvar sType = typeof source;

//2 番目のパラメータの型が未定義またはブール値の場合

if( sType === '未定義' || sType === 'boolean' ) {
deep = sType === 'boolean' ?
source = target; // ターゲットをソースに割り当てます。 /Here これはオブジェクト
を参照します}


コードの最後の 2 行について質問がある人がいるかもしれません。これが私がそれを処理する方法です。パラメータ target とsource の両方が存在し、source がブール値でない場合は、ソース オブジェクトの内容がターゲットにコピーされます。それ以外の場合、ターゲット オブジェクトは Object オブジェクトにコピーされます。 deep のデフォルトは false です。
安全上の理由から、ソースが上記の条件を満たしているが、それが Object オブジェクトではない場合、または Function オブジェクトである場合 (これには他の問題が含まれます) も判断する必要があります。また、コピーする方法もありません。この時点では、source を空のオブジェクトに設定します。つまり、コピー操作は実行されません。
コード:

コードをコピー

コードは次のとおりです: if( typeof source !== 'object' && Object.prototype.toString.call(source) !== '[object Function]' ) source = {};

注: Function オブジェクトの場合typeof 操作を実行すると「object」も返されますが、これを正しくコピーできない (少なくとも私のメソッドでは) ため、これを削除する必要があります。
以下はコピーするループです。ここでは再帰が使用されます。
コード:

コードをコピー

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

var i=1,option;
// 外側のループはオプションを順番に変更し、最初にターゲットに設定し、次にソースに設定します。
while(i options = i === 1 ? target : source;
if( options != null ) {
// 内部ループは対応する属性をコピーします
for( var name in options ) {
var src = target[name], copy = options[name];
if(target === copy)
continue
// deep が true に設定され、属性がオブジェクト
if(deep && copy && typeof copy === 'object' && !copy.nodeType)
//Recursion
target[name] = this.extend(src ||(copy.length) != null ? [] : {})、コピー、ディープ);
else if(copy !== 未定義)
target[name] = コピー; ;
}


ここでは、オブジェクト内のオブジェクトを順番にコピーするために再帰的メソッドが使用されます。この機能は完了です。コード全体は次のとおりです。
コード:

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

* @param {Object} ターゲットのターゲット オブジェクト。

* @param {Object} ソース ソース オブジェクト。
* @param {boolean} deep オブジェクト内のオブジェクトをコピー(継承)するかどうか。
* @returns {Object} ソース オブジェクトのプロパティを継承する新しいオブジェクトを返します。
*/
Object.extend = function(target, /*optional*/source, /*optional*/deep) {
target = target {}; , i = 1, オプション;
if( sType === '未定義' || sType === 'boolean' ) {
deep = sType === 'boolean' ソース : false;ソース = ターゲット;
ターゲット = this;
}
if( ソースのタイプ !== 'オブジェクト' && Object.prototype.toString.call(ソース) !== '[オブジェクト関数]' )
ソース = {};
while(i オプション = i === 1 ? ターゲット : ソース;
if( オプション != null ) {
for(オプションの変数名 ) {
var src = target[name], copy = options[name];
if(target === copy)
if(deep && copy && typeof; copy === 'object' && !copy.nodeType)
target[name] = this.extend(src ||
(copy.length != null ? [] : {}), copy, deep) ;
else if(copy !== unknown)
target[name] = copy;
}
return target; ;


使用例:
コード:




コードをコピー

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


var source = {id:1, name:'Jack Source'}, target = {name:'Jack Target', 性別:1,tel:{homeTel:"158255",officeTel: "02112585" }};

var newObj1 = Object.extend(ターゲット, ソース);