[Udemy - 100일 코딩 챌린지] 3/1 개발공부일지(조건문, 반복문 연습문제)

2/27 네이버 DEVIEW 2023 다녀오고 몸살 기운 있어서 바로 집가고 어제는 개발이든 글쓰기든 못하고

아 네이버 블로그에 다녀온 후기글 남겼다. 후후 핸드폰으로 작업하기는 네이버블로그가 티스토리보다 훨씬 편한 듯!

 

오늘부터 section13 연습문제!

아래사진처럼 결과가 나와야 하는데

코드 실행이 안 된다.

열심히 구글링 해보니, 내가 오류 메시지에서 이해한 대로, 해당하는 요소가 없다고 한다.

 

잘 선언했는데, 뭐가 문제지.. 하고 한 10분 이리저리 고치고 저장다시하고

아 " 와 ' 사이에는 큰 차이가 없다. 쌍따옴표 작은따옴표 수정이나 하고 있고 ㅋㅋㅋㅋ

그러다가

js code
const userNumberInputElement = document.getElementById("user-name");

html code
    <div class="control">
      <label for="user-number">Your Number</label>
      <input type="number" id="user-number">
    </div>

후후후 저렇게 보면 좀 보이는데, 코드 다발들 속에서 보려니 당최 보이질 않았다 ㅜ

문제는 오타인 걸로.. ㅋㅋㅋㅋㅋㅋㅋㅋ

그러고 실행했는데, 이제는 결과값이 화면에 나오지 않는다.

또 뭐가 잘못됐다. 시키는 대로 했는데 곱게 했었는데,,

code를 보니까... ㅋㅋㅋㅋㅋ 또 오타가 떴다

 

before)  outPutResultElement.style.diplay = "block";
after)   outPutResultElement.style.display = "block";

우키키 나를 맹신하지 말자. display를 diplay로 입력할 건 뭐람... 영타 연습이나 더 열심히 해야겠다 ㅜㅜ

 

 

for ('...' of 'array') 형태로 사용 

for ('...' in 'object') 형태로 사용 

 

주사위 굴리기 예제

const diceRollsListElement = document.getElementById("dice-rolls");

let numberofRolls = 0;
  while (rollDice() != enteredNumber) {
    const randomNumber = 0;
    numberofRolls++;
    const newRollListItemElement = document.createElement("li");
    const outputText = "Roll " + numberofRolls + ":  " + rollDice();
    newRollListItemElement.textContent = outputText;
    diceRollsListElement.append(newRollListItemElement);
    // hasRolledTargetNumber = rolledNumber == enteredNumber;
  }
  
    while (!hasRolledTargetNumber) {
    const rolledNumber = rollDice();
	(...)
    hasRolledTargetNumber = rolledNumber == enteredNumber; 
    //2. 비교연산자 결과는 boolean value 이다. if check 필요 없음
  }

(설명은 들었었겠지만) 이번에 배운 것

1. list에 새로 생성한 value 입력

  - parent element 인 ul 를 먼저 선택하고(첫줄)

  - 새로 생성을 위한 li element를 만들고 | by  document.createElement("li");

  - ul에 생성된 li element를 추가한다. append('(새로 생성하여 값을 입력받고 있는 li element)');

 

while 문은 특정 조정이 충족되지 않을 때까지 동작한다.

for-in 반복문을 사용하여 객체의 모든 속성을 반복할 수 있다.

for-of 반복문을 사용하여 배열의 모든 요소를 반복할 수 있다.

 

이달 중으로 frontend 는 한번 다 들을 듯!

고생했다. 끝이 보인드...