javascript - for(var i in arguments) が機能しないのはなぜですか?

Question

私はJavaScriptが初めてです。なぜこれが機能しないのかを理解しようとしています：

function myFunction(){
    document.getElementById("result").value=add(1,2);
}
function add(){
    var sum = 0;
    for(var i in arguments)
        sum += i;
    return sum;
}

これは を出力します001。なんで？

Answer 1

キーを反復しています。次のようにします。

function add(){
    var sum = 0;
    for(var i in arguments)
        sum += arguments[i];
    return sum;
}

より具体的には、キーは文字列で"0"あり"1"、したがって、最初の 0 と後続のキーを連結した応答になります。

また、最新のプラットフォームでの JavaScript に関心がある場合は、以下が非常に明確で簡潔です。

function add(){
    return [].reduce.call(arguments, function(a, b) {
        return a+b;
    });
}
console.log(add(1,2));

Answer 2

これを試してください：

function add(){
    var sum = 0, x = 0;
    for(var i in arguments){
        //the key is an index
        if(!arguments.hasOwnProperty(i)) continue;

        // try converting argument[i] to a number
        x = +arguments[i];

        // check if argument is a valid number 
        if(!isNaN(x)) {
            sum += x;
        }
    }
    return sum;
}

デモ: http://jsfiddle.net/vg4Nq/

Answer 3

ここに別の可能性があります。

function add() {
    var numbers = [].slice.call(arguments),
        sum = 0;

    do {
        sum += numbers.shift();
    } while (isFinite(sum) && numbers.length);

    return +sum;
}

console.log(add(1, 2, 3, 4, 5));

の上jsfiddle

更新: これは よりもクロス ブラウザーですreduce。データをもう少しチェックしたい場合は、これを改善することもできます。

function add1() {
    var numbers = [].slice.call(arguments),
        sum = 0,
        x;

    do {
        x = numbers.shift();
        sum += (typeof x === "number" ? x : NaN);
    } while (isFinite(sum) && numbers.length);

    return +sum;
}

console.log("add1", add1(1, 2, 3, 4, 5));
console.log("add1", add1(1, 2, 3, 4, 5, ""));
console.log("add1", add1(1, 2, 3, 4, 5, "0xA"));
console.log("add1", add1(1, 2, 3, 4, 5, NaN));
console.log("add1", add1(1, 2, 3, 4, 5, Infinity));
console.log("add1", add1(1, 2, 3, 4, 5, -Infinity));
console.log("add1", add1(1, 2, 3, 4, 5, true));
console.log("add1", add1(1, 2, 3, 4, 5, false));
console.log("add1", add1(1, 2, 3, 4, 5, null));
console.log("add1", add1(1, 2, 3, 4, 5, undefined));
console.log("add1", add1(1, 2, 3, 4, 5, []));
console.log("add1", add1(1, 2, 3, 4, 5, {}));

そして、チェックなしでそれを比較できます

function add2() {
    return [].reduce.call(arguments, function (a, b) {
        return a + b;
    });
}

console.log("add1", add2(1, 2, 3, 4, 5));
console.log("add1", add2(1, 2, 3, 4, 5, ""));
console.log("add2", add2(1, 2, 3, 4, 5, "0xA"));
console.log("add2", add2(1, 2, 3, 4, 5, NaN));
console.log("add2", add2(1, 2, 3, 4, 5, Infinity));
console.log("add2", add2(1, 2, 3, 4, 5, -Infinity));
console.log("add2", add2(1, 2, 3, 4, 5, true));
console.log("add2", add2(1, 2, 3, 4, 5, false));
console.log("add2", add2(1, 2, 3, 4, 5, null));
console.log("add2", add2(1, 2, 3, 4, 5, undefined));
console.log("add2", add2(1, 2, 3, 4, 5, []));
console.log("add2", add2(1, 2, 3, 4, 5, {}));

の上jsfiddle

また、導入されたこれらの追加チェックによって、パフォーマンスはどのように影響を受けるのでしょうか?

どれどれ、jsperf

他のソリューションをパフォーマンス テストに自由に追加してください。- その他を追加しました。

とにかく、オブジェクトをfor..inループするときは使用を避け ( にアタッチされている可能性のあるメソッドをループしないようにするため)、他の通常のループ メソッドのいずれかを選択します: 、、またはargumentsargumentsArrayforwhileforEachreduce

関連性を参照してください:配列の繰り返しで「for…in」を使用するのはなぜ悪い考えなのですか?