3

私は jQuery.extend を使用して、このようなデフォルトのプロパティを置き換えてきました

var Car = function(options){
    var defaultOptions = {
        color: "hotpink",
        seats: {
            material: "fur",
            color: "black",
            count: 4
        },
        wheels: 4
    }
    this.options = $.extend(true,{},defaultOptions,options); 
}

var myCar = new Car({
    color: "blue",
    seats: {
        count: 2,
        material: "leather"
    }
});

alert(myCar.options.color); // "blue"
alert(myCar.options.seats.color); // "black"
alert(myCar.options.seats.count); // 2

うまく機能しますが、ライブラリなしで同様の結果を達成するための最良の方法を知りたいです。関数でいくつかのデフォルト設定を定義し、それらを引数の設定に置き換えたいだけです。それを行うたびにライブラリを含めるのはやり過ぎです。

4

3 に答える 3

4

基本的には、 を再帰的に使用するだけですfor..inソース コードで jQuery の実装の完全なソースを確認できます(その行番号は時間の経過とともに腐敗しますが、core.js.

これは非常に基本的なオフザカフです。

function deepCopy(src, dest) {
    var name,
        value,
        isArray,
        toString = Object.prototype.toString;

    // If no `dest`, create one
    if (!dest) {
        isArray = toString.call(src) === "[object Array]";
        if (isArray) {
            dest = [];
            dest.length = src.length;
        }
        else { // You could have lots of checks here for other types of objects
            dest = {};
        }
    }

    // Loop through the props
    for (name in src) {
        // If you don't want to copy inherited properties, add a `hasOwnProperty` check here
        // In our case, we only do that for arrays, but it depends on your needs
        if (!isArray || src.hasOwnProperty(name)) {
            value = src[name];
            if (typeof value === "object") {
                // Recurse
                value = deepCopy(value);
            }
            dest[name] = value;
        }
    }

    return dest;
}
于 2012-07-25T09:34:20.823 に答える
0

2階が言ったように、jQueryのAPI「拡張」をエミュレートできます。これを管理するより良い方法はないと思います。ということで、jQueryのAPIが適切かと思います。

于 2012-07-25T10:26:11.587 に答える
0

ES6 ではスプレッド演算子が導入されました。

var Car = function(options){
    var defaultOptions = {
        color: "hotpink",
        seats: {
            material: "fur",
            color: "black",
            count: 4
        },
        wheels: 4
    }
    this.options = {...defaultOptions, ...this.options};
}

var myCar = new Car({
    color: "blue",
    seats: {
        count: 2,
        material: "leather"
    }
});

参考文献:

于 2019-10-11T06:13:40.967 に答える