인프런 커뮤니티 질문&답변

sellermax

작성한 질문수

자바스크립트 비기너: 튼튼한 기본 만들기

7. 엘리먼트 값을 문자열로 변환, [코딩 시간]

주석 넣으면서 해보았습니다.

작성

215

"use strict";

var html = [];  //배열생성
html.push("<ul>"); //맨위에 <ul>태그
for (var i = 1; i <= 10; i++) { //1부터10까지 넣을 i
  html.push("<li id=id+i>" + "id" + i + "</li>"); 
} //
html.push("</ul>"); //맨밑에 </ul>태그
document.body.innerHTML = html.join(""); //HTML에 
그동안 작업했던 var html join("")으로 배열사라지면서 
마크업됨

근데 선생님 질문이있습니다.

  html.push("<li id=id+i>" + "id" + i + "</li>");

이부분에서 궁금한점이 있습니다.

push로 하면 화면상으로 id1부터 밑으로 쭈르륵 id10까지 보여지는데요.

id1
id2
id3
id4
id5
id6
id7
id8
id9
id10

html.unshift("<li id=id+i>" + "id" + i + "</li>");

push 말고 unshift로 해보니까 반대로 id10부터 id9,8,7,6,5순으로 아래부터 향하더라고요.

id10
id9
id8
id7
id6
id5
id4
id3
id2
id1

이게 배열 순서와 연관이 되어있나요?

push는 배열이 끝으로 추가되는 특징이고

unshift는 배열이 앞에서부터 추가되는 특징이랑 연관되어있을까요?

oop javascript

퀴즈

42%나 틀려요. 한번 도전해보세요!

배열 엘리먼트를 `delete` 연산자로 삭제할 때, `pop`이나 `shift` 같은 메소드와 비교했을 때 주요 차이점은 무엇일까요?

`delete`는 엘리먼트를 완전히 제거하고 길이를 줄이지만, 메소드는 값을 undefined로 만듭니다.

`delete`는 엘리먼트 값을 undefined로 만들고 길이는 유지하지만, 메소드는 엘리먼트를 제거하고 길이를 줄입니다.

`delete`는 첫 번째 엘리먼트를 삭제하고, 메소드는 마지막 엘리먼트를 삭제합니다.

`delete`는 항상 성공하고 true를 반환하지만, 메소드는 실패할 수 있습니다.

답변 1

김영보

지식공유자

push는 배열이 끝으로 추가되는 특징이고
unshift는 배열이 앞에서부터 추가되는 특징이랑 연관되어있을까요?
==> 그렇습니다.
-----------------------
var html = []; //배열생성

1. 위 형태를 아래처럼 코드 위에 작성합니다. 주석을 두 줄, 세 줄 작성할 수 있는 마음의 여유가 생깁니다. 2~3줄의 코드를 묶어서 주석을 작성할 수 있습니다.
2. 주석을 단어 조합이 아닌 문장으로 작성하세요. 그러면 코드 위와 아래에 작성한 주석이 시나리오로 연결됩니다.
3. 기능(배열 생성)은 코드를 보면 알 수 있으므로, 이것을 생성하는 목적을 작성합니다.

// <ul><li></ul>이 설정될 배열을 생성한다.
// 또는 배열에 <ul><li></ul>이 설정된다.
var html = [];

이 내용을 강좌에서 설명했어요. 진도 나가는 것이 촛점이 아니라면, 다시 처음부터 들어보세요. 지금처럼 코딩하는 것 잊지 말고요.^^

sellermax

작성한 질문수

전체 Q&A

질문하기