[MBTI 테스트(10)] 결과 계산하기 (배열, sort, for문 안의 for문으로 array 안의 array 하나씩 호출하기)

https://youtu.be/Ejz4_FdrNd0

 

배열 만들기

사용자가 버튼을 선택할 때마다

배열의 내용을 추가해준다.

const select = [];

위와 같이 select라는 Array를 생성한다.

 

 

특정 답변을 선택했을 때 지정된 값이 반환되도록 해주기

for 문 내에서 생성된 i도 parameter로 넣어서 몇 번째인지 체크해줄수 있도록 한다.

  for(let i in qnaList[qIdx].a){
    addAnswer(qnaList[qIdx].a[i].answer, qIdx, i);
  }

qnaList를  for문으로 생성할 때

addAnswer 함수를 호출하는데,

parameter에 for 문의 i 를 추가해준다.

 

호출할 때 i를 추가해줬으니

addAnswer함수를 정의해줄 때도

i가 parameter로 들어가야한다.

 

function addAnswer(answerText, qIdx, idx)
...
    setTimeout(() =>{
      select[qIdx] = idx;
      for(let i = 0; i< children.length; i++){
        children[i].style.display = 'none';
      }
      goNext(++qIdx);

select[qIdx] = idx;

이 부분도 잘 이해안되지만 일단 패스...

 

 

goresult 함수에서 콘솔창에 출력되도록 아래와 같이 작성하고 확인해본다.

  console.log(select);

 

select 배열이 잘 생성되었다.

 

 

답변에 따라 value를 1씩 증가시켜 결과 도출하기

function calResult(){
  var pointArray = [
    {name: 'mouse', value: 0, key: 0},
...
    {name: 'pig', value: 0, key: 11},
  ]

  for(let i = 0; i < endPoint; i++){
    var target = qnaList[i].a[select[i]];
    for(let j = 0; j < target.length; j++){
      for(let k = 0; k < pointArray.length; k++){
        if(target.type[j] === pointArray[k].name){
          pointArray[k].value += 1;

결과를 계산하는 calResult 함수를 생성한다.

 

pointArray라는 배열을 만들어

각 결과값인 name과 value, key를 생성한다.

 

여기서 for문이 세 번 사용되는데

i for문에서는 선택한 답변을 target으로 생성한다.

예를 들면, 첫 번째 답변을 골랐다면

{answer : a 이성사이에 ~ 'chick']}까지 선택된다.

=> js파일끼리는 따로 호출을 안해도 사용할 수 있는듯?

 

  for(let i = 0; i < endPoint; i++){
    var target = qnaList[i].a[select[i]];
    for(let j = 0; j < target.length; j++){
      for(let k = 0; k < pointArray.length; k++){
        if(target.type[j] === pointArray[k].name){
          pointArray[k].value += 1;

j for문에서는 선택한 답변 내에서

type의 array를 for문으로 끝까지 읽어준다.

 

예를 들면 이 답변을 선택했다고 하면

target.type[] 안의 'cow'부터 'chick'까지

for k 반복문을 통해 pointArray의 mouse~pig까지 체크하며

동일한 경우 해당 pointArray의 value값을 1씩 증가시킨다.

 

여기서 궁금한 점은 j for문인데...

target.length라고만 해도 type부분의 끝까지

작동되는 것인지.

 

tartget이라는 array속에 있는 array까지 자동으로 length에 포함되는 것인지?

일단은 패스하고 나중에 다시 생각해본다.

=> 강의 뒷부분에 수정함.

=> target.type.length로 !!

 

 

sort

  var resultArray = pointArray.sort(function(a,b){
    if(a.value > b.value){
      return -1;
    }
    if(a.value < b.value){
      return 1;

 

pointArray를 value 값 기준으로 정렬해준다.

 

  let resultword = resultArray[0].key;
  return resultword;

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

Array.prototype.sort() - JavaScript | MDN

 

이해가 잘 안되므로 나중에 mozilla 의 javascript sort페이지를 다시 읽어본다.

 

 

이전 에러 수정

function goNext(qIdx){
  if(qIdx === endPoint){

영상 9분부터 

 

 

sort 로 정렬된 값 확인하기

다음영상에서는

가장많은 value값을 가진 결과를

결과로 출력하도록 한다.