[Javascript] console 사용 시 쉼표(,)와 +의 차이

 

 

 

 

•  , 를 사용하면 별도의 객체로 반환되어 내부 값을 확인 가능함.
•  + 를 사용하면 toString()이 호출되어 문자 타입으로 형변환 후 값이 반환되어 객체 내부의 값을 확인 불가능함.

 

예시 1)

let array = [
    {
        a: 1,
        b: 2
    },
    {
        a: 3,
        b: 4
    },
    {
        a: 5,
        b: 6
    },
];

console.log('logging with ,: ', array); // logging with ,:  (3) [{…}, {…}, {…}]
console.log('logging with +: '+ array); // logging with +: [object Object],[object Object],[object Object]

console.log(array.toString()); // '[object Object],[object Object],[object Object]'

 

 

 

예시 2)

<ul id="post-list">
  <li id="post-1">Item 1</li>
  <li id="post-2">Item 2</li>
  <li id="post-3">Item 3</li>
  <li id="post-4">Item 4</li>
  <li id="post-5">Item 5</li>
</ul>

<script>
    const list = document.getElementById('post-list');
    
    console.log('logging with ,: ', list);  // list: <ul id="post-list">...</ul>
    console.log('logging with +: '+ list);  // list: [object HTMLUListElement]
    
    console.log(list.toString());  // '[object HTMLUListElement]'
</script>