Javascript findメソッドが最初の一致後に停止しない

Question

私の問題は、javascriptを使用して特定のcssクラス（grid-8/col-4）を抽出したいということです。

目的のクラスが最初または唯一の配列要素である場合、javascript関数 "find"は一致する要素に対して未定義を返しますが、私にとっては意味がありません。 ​​

私は間違いを見つけられません。すべてのconsole.logステートメントは、 "find"関数を除き、期待値を返します。

うまくいけば、私にヒントを与えることができます！

HTML：

<div class="grid-8 layout"> 

    <div class="col-4 master"> 
      <h1>Headline</h1> 
      <p>Lorem ipsum dolor sit amet.</p> 
    </div> 
</div> 

のJavaScript：

$(function() { 
    var $layout = $(".layout"); 
    var $elem = $(".master"); 

    var layoutColumNumber = getNumberOfColums($layout, 'grid'); 
    var elementColumNumber = getNumberOfColums($elem, 'col'); 

    function getNumberOfColums(object, type){ 
     var classArray = getElementClassArray(object); 
     var elementColWidth = null; 

     switch(type){ 
      case 'grid': 
      elementColWidth = classArray.find(gridClassPosition).split("-")[1]; 
      break; 
      case 'col': 
      elementColWidth = classArray.find(colClassPosition).split("-")[1]; 
      break; 
     } 
     return elementColWidth; 
    } 

    function getElementClassArray(object){ 
     return object.attr('class').split(' '); 
    } 

    function gridClassPosition(element, index, array){ 
     return (element.startsWith('grid-')) ? index : false; 
    } 

    function colClassPosition(element, index, array){ 
     return (element.startsWith('col-')) ? index : false; 
    } 

}); 

Answer 1

回答は、配列内の最初の要素のインデックスは0であるとJavaScript 0に真の値ではないこと、です。それは偽りの価値です。
これは、仕様で正しく記述されているように、find関数が 'undefined'を返す理由です。

この場合、戻り値は関係ありません。したがって、 "find"が目的の要素に到達するとtrueを返すだけで十分です。

console.log(classArray.find(colClassPosition))を使用すると、配列に現在の要素があることがわかります。配列の現在の要素が分割関数を呼び出すことができます。