ラジオボタンを使用して/ forEachのJavascript

Question

forループとforEachループの作業方法に関する質問があります。私は3つのコードサンプルを持っていますが、2つは動作しますが、forEachループでは戻りません。なぜですか？

1. 作品

   const radioButtons = document.getElementsByName("option"); 
   
   for (let i = 0; i < radioButtons.length; i++) { 
       if (radioButtons[i].checked) { 
        return radioButtons[i]; 
       } 
   } 
   

2. 作品

   const radioButtons = document.getElementsByName("option"); 
   let selectedRadioButton; 
   
   radioButtons.forEach(function(button) { 
       if (button.checked) { 
        selectedRadioButton = button; 
       } 
   }); 
   return selectedRadioButton; 
   

3. が動作しない -

   const radioButtons = document.getElementsByName("option"); 
   
   radioButtons.forEach(function(button) { 
       if (button.checked) { 
        return button; 
       } 
   }); 
   

Answer 1

のforEachに返します

3番目の例のreturn文は、forEach文の匿名関数に値を返します。

Answer 2

Array.prototype.forEachは、ブレーク動作をサポートしていないためです。 この関数の目的は、配列の各要素を無条件に訪問することです。あなたが望む方法は、最近のブラウザでArray.prototype.filter以降のブラウザでは、Array.prototype.find

const radioButtons = document.getElementsByName("option"); 

const button = radioButtons.filter(function(button) { 
    return button.checked; 
})[0]; 

です：

const radioButtons = document.getElementsByName("option"); 

const button = radioButtons.find(button => button.checked); 

D.サイモンは、彼/彼女の答えで指摘returnをというように、それは、注目に値しますコールバック内のステートメントは、反復メソッドではなく、コールバック自体を返します。 JavaScriptは非ローカルリターンとして知られているものをサポートしていません。ここで

は、いくつかのライブの例は以下のとおりです。

(function() { 
 
    'use strict'; 
 

 
    var values = [1, 2, 3, 4, 5, 6]; 
 

 
    var three = values.filter(function(value) { 
 
    return value === 3; 
 
    })[0]; 
 

 
    console.info(three); 
 
}());

(function() { 
 
    'use strict'; 
 

 
    const values = [1, 2, 3, 4, 5, 6]; 
 

 
    const three = values.find(value => value === 3); 
 

 
    console.info(three); 
 
}());