一つの配列から取り出した要素を二つの配列に分配したい。
配列から特定の要素をstartからendの条件関係なく、取得するメソッドがなさそうで困っている。
js
1 let scoreA = array.splice(array[0],array[1],array[3],array[4],array[7]); 2 let scoreB = array.splice(array[2],array[5],array[6],array[8],array[9]);
spliceが正常に機能していない。
js
1script.js:26 (3) [7, 7, 7] 2script.js:27 (3) [7, 7, 7]0: 71: 72: 7length: 3__proto__: Array(0)
該当のソースコード
html
1<!DOCTYPE html> 2<html lang="en"> 3 4<head> 5 <meta charset="UTF-8"> 6 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 7 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 8 <title>test</title> 9 <link rel="stylesheet" href="css/style.css"> 10</head> 11 12<body> 13 <header> 14 <div class="header"> 15 <h1 class="header__title">パーソナリティ診断</h1> 16 </div> 17 </header> 18 <div class="content"> 19 <form action=""> 20 <div class="content__card"> 21 <span class="content__text">Q1: 懸命に努力をすれば、たいてい望むものを達成できる。</span> 22 <div class="content__flex"> 23 <div class="content__bg-text">同意する</div> 24 <div class="content__input-wrapper" id="inputWrap"> 25 <input type="radio" name="element1" value="7"> 26 <input type="radio" name="element1" value="6"> 27 <input type="radio" name="element1" value="5"> 28 <input type="radio" name="element1" value="4"> 29 <input type="radio" name="element1" value="3"> 30 <input type="radio" name="element1" value="2"> 31 <input type="radio" name="element1" value="1"> 32 </div> 33 <div class="content__bg-text">同意しない</div> 34 </div> 35 </div> 36 <div class="content__card"> 37 <span class="content__text">Q2: 計画を立てたら、その通りに実行できると確信している。</span> 38 <div class="content__flex"> 39 <div class="content__bg-text">同意する</div> 40 <div class="content__input-wrapper"> 41 <input type="radio" name="element2" value="7"> 42 <input type="radio" name="element2" value="6"> 43 <input type="radio" name="element2" value="5"> 44 <input type="radio" name="element2" value="4"> 45 <input type="radio" name="element2" value="3"> 46 <input type="radio" name="element2" value="2"> 47 <input type="radio" name="element2" value="1"> 48 </div> 49 <div class="content__bg-text">同意しない</div> 50 </div> 51 </div> 52 <div class="content__card"> 53 <span class="content__text">Q3: 純粋な技能を必要とするゲームよりも、ある程度運が関与するゲームの方を好む。</span> 54 <div class="content__flex"> 55 <div class="content__bg-text">同意する</div> 56 <div class="content__input-wrapper"> 57 <input type="radio" name="element3" value="7"> 58 <input type="radio" name="element3" value="6"> 59 <input type="radio" name="element3" value="5"> 60 <input type="radio" name="element3" value="4"> 61 <input type="radio" name="element3" value="3"> 62 <input type="radio" name="element3" value="2"> 63 <input type="radio" name="element3" value="1"> 64 </div> 65 <div class="content__bg-text">同意しない</div> 66 </div> 67 </div> 68 //文字数制限のため割愛 Q4-Q10// 69 <button type="submit">送信</button> 70 </form> 71 </div> 72 <script src="script.js"></script> 73</body> 74 75</html>
js
1const radio = document.querySelectorAll('input'); 2const btn = document.querySelector('button'); 3const array = []; 4 5radio.forEach(element => { 6 element.addEventListener('click', () => { 7 const n = element.name.replace('element', '') - 1; 8 if (element.checked) { 9 array[n] = Number(element.value); 10 } 11 // totalArray = array.reduce(function (a, x) { 12 // return a + x; 13 // }) 14 }); 15}); 16 17btn.addEventListener('click', (event) => { 18 event.preventDefault(); 19 if (array.length !== 10) { 20 alert('error'); 21 } else { 22 alert('ok'); 23 let scoreA = array.splice(array[0],array[1],array[3],array[4],array[7]); 24 let scoreB = array.splice(array[2],array[5],array[6],array[8],array[9]); 25 26 console.log(scoreA); 27 console.log(scoreB); 28 // array.reduce(function (sum, element) { 29 // return sum + element; 30 // }) 31 // console.log(array); 32 } 33});
試したこと
Array.prototype.slice()
について調べてみた。
規則的な要素のみならず、不確定な順番の要素も取得できないspliceにメソッドとしての不備を感じてしまう。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。