TyeError: cannot read property includes

[ㅁㄴ(24.126)]

 vue js 처음 쓰는거라 조금 이상할 수도 있음

this.state.chosenTraits[j].includes(this.state.jsonCharacters[i].tags[j]);

처럼 레이아웃을 짜면 TypeError: cannot read property includes of 'undefined' 라는게 뜸

그럼 this.state.chosenTraits[j]에 아무것도 없어야 한다는건데 문제는 이게 들어가는 함수는 chosenTraits에 이미 정보 다 들어가고 짜여졌을때임. 실제로 출력해보면 chosenTraits 쭉 나옴.

궁여지책으로 화살표함수

        this.state.jsonCharacters = this.state.jsonCharacters.map(character => {

            // The number of tags the character has that were found in prioritizedTraits

            const characterPrioritizedTraits = character.tags.filter(tag => prioritizedTraits.includes(tag)).length;

            const characterPreferredTraits = character.tags.filter(tag => preferredTraits.includes(tag)).length;

            character.score = characterPrioritizedTraits * 10 + characterPreferredTraits * 5;

            return character;

        });

느낌으로 넣어봤는데 이렇게 하니까 안뜸.

도대체 뭐가 문제였던건지 모르겠음

디버거 돌려봐야하나

[ㅁㄴ(24.126)]

구글 검색해보니까 this. 관련 생기는 문제라고 하는데 어차피 같은 스코프에 들어가는건데 상관 없지 않나? 컴파일링 할때 생기는 문제인거?

[ㅁㄴ(24.126)]

근데 그러면 왜 저렇게 화살표 함수 쓰면 상관 없음? 처음에 prioritizedTraits 셋팅 할때도 includes 넣었는데 const preferredTraits = this.state.chosenTraits.filter(trait => trait.includes("prefer")).map(trait => trait.replace("prefer", ""));