하티손
20
2020-11-30 20:55:27
1
124

초보) 자바스크립트에서 array의 item은 객체인가요?


자바스크립트 공부중에 질문드립니다.


배열의 요소(item)은 객체인가요?

아래 코드에서, this가 가르키는 대상이 무엇인지 모르겠습니다.

제가 시도해본것은,,
먼저 this 대신 checking이나 checking[i]를 넣어도 오류가 뜹니다.. parentNode를 찾을 수 없다고하네요

그런데 this가 가르킬 것은 저 두개밖에 없어보입니다..


그래서 제가 내린 결론은, 
this가 checking을 가르키게되면 checking은 현재 배열인데, this는 한개만 가르켜야 하므로 여러개를 담고 있는 배열은 가르킬 수 없다.
따라서 this는 checking[i]를 가르키는데, 이때 checking[i]는 array의 item 이므로 객체가 아니다.
그런데 this는 객체이기때문에 this로는 실행이 되는 것이다

이런 이상한 앞뒤안맞는 결론이 나와버렸습니다. 결과를 보고 끼워맞추려니,, 안되네요

제 생각의 오류를 짚어주셨으면 합니다.

아래는 js 코드입니다.
var checking = document.querySelectorAll('.check');
// var fontColor= document.querySelector('.check');



for (var i=0; i<checking.length; i++){

    checking[i].addEventListener('click',function(){
        this.parentNode.style.color='#ccc';
    });
}

이것은 html 코드입니다.

DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>연습문제 2title>
    <style>
        ul{
            list-style: none;
        }
        li {
            font-size:20px; 
            line-height: 35px;
        }
        .check {            
            color:#ccc;
            font-size:20px;
            margin-right:25px;
        }
        .check:hover {
            color:#222;
        }
    style>
head>
<body>
    <h1>할 일 목록h1>
    <ul>
        <li><span class="check">&check;span>할 일 1 li>
        <li><span class="check">&check;span>할 일 2 li>
        <li><span class="check">&check;span>할 일 3 li>
        <li><span class="check">&check;span>할 일 4 li>
        <li><span class="check">&check;span>할 일 5 li>
    ul>

    
    <script src="quiz2.js">

    script>
body>
html>

0
  • 답변 1

  • siva6
    5k
    2020-11-30 23:06:19

    무슨 말인지 잘 모르겠지만,

    저 소스에서 this는 click에 대한 handler인 function()을 호출하는 객체가  this로 전달됩니다.
    결국은 checking[i]와 동일합니다.

    그런데, checking[i]로 바꾸면 오류가 나는 것은 var라는 키워드의 scope가 그렇게 동작합니다.
    checking[i]를 사용하더라도, for(var i 를 for(let i 로만 바꿔도 오류는 발생하지 않습니다.

  • 로그인을 하시면 답변 을 등록할 수 있습니다.