• <참고(https://velog.io/@foeverna/series/Javabasic) foeverna라는 분의 velog인데 여기서도 정보를 배울 수 가 있었다.>(감사합니다.)

> 1. 학습한 내용

• 선택자를 잘 알아야 명확하게 타겟팅을 할 수 있음( CSS할때)
• 보기- 명령팔렛트 - wrap(약어로 래핑) 단축키지정가능 -> 드래그 해서 원하는 선택자를 입력하면 그 부분을 래핑을 해줌(드래그 해놓고
• view -> command palette -> emmet: wrap 클릭 -> 원하는 선택자로 입력
• 이렇게 들어가서 오른쪽에 보면 톱니바퀴(설정탭)으로 들어가면 Keyboard SHortcuts 라고 나오는데 여기서 Keyblinding 란의 해당 명령어 행의 공간을 더블클릭해주면 원하는 단축키로 지정이 가능
• 로렘 픽숨 - 랜덤이미지를 만들어주는 사이트
• 로렘 잇숨? 입숩? - 랜덤문장을 만들어주는 사이트
• cover 라고 이미지 사이즈 설정하면 배경으로 설정하기 좋은 크기로 자동으로 바뀜
• 대쉬는 자바스크립트에서 글자와글자사이의 위치에 허용되지 않음. 그래서 대문자를 사용
• style.css 의 파일을 만들어서 링크를 걸어주면 해당 스타일(CSS)디자인이 자동으로 그 링크가 있는 모든 파일에 적용이 됨. <link rel="stylesheet" href="style.css"> 이런식으로.
• querySelector 중요한 함수 자바스크립트를 이용해서 해당태그를 선택할 때 document.querySelector 함수를 사용하게 되는 것임. 클래스명으로도 선택가능(태그말고도)
• '클래스명 + h1(태크이름)' - 자손 -> 위의 함수를 사용해서 선택할때 입력하는 내용
• '클래스명 + >h1' - 직계자식(직계자손)
• 제어문(조건문)/반복문
• 불리언(Boolean), 비교연산자(분리언을 만들어내는 역할) / 논리연산자 등... 관련 연산자 매우 많음.
• 불리언은 구체적인 데이터가 단 두개/숫자는 무한히 많음/문자는 무한히 까진 아니더라도 매우 많음.(데이터가)
• ! -> not 표시 console.log(1!==1);
• ===/== 같은 결과값 않다 같지
  진짜로 같냐/대충 같냐 의 느낌.
• = 대입 연산자
• if(조건문(혹은 조건식이라고도 부름)){조건이 트루(true)라면 실행될 실행될 명령}
• let 명령문은 블록 스코프의 범위를 가지는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수도 있음.
• 버튼 설정해서, 각 버튼에 대해서 개개의 설정을 달 때,input으로 설정해도 되지만 querySelector가 가장 먼저 나오는 하나만 선택되기 때문에 버튼이 여러개 있을 경우 헷갈릴 수 있어서 id를 사용.
• if(조건식) if는 참인 경우가 자동으로 설정되도록 설계되어있기때문에, 조건식이 참이면 {statements}가 작동되고, 그렇지 않으면(else) 'else'의 statements가 실행된다. 혹은 else가 없을 경우는 아예 실행이 되지 않도록 된다. 즉, 값이 나오지 않는다.(조건식이 거짓일 경우이므로)
• id > class > tag 순으로 영향력이 강함. 즉, 구체적인 단위 일수록!
• 이벤트안에서 this는 이벤트 안에서 실행되는 태그를 가르키도록 약속이 되어있음
• 맥락적으로 달라짐<- this
• link 는 기본색상이 파랑, 방문한 기억이 있으면 보라 (a 태그)
• a 태그 색상 바꾸기
  a 태그 많을때 -> document.queryselector('a') -> 제일 처음 a태그만 됨
  모든 a -> api 명령 > document.queryselectorAll('a') 요것이 배열이다.
  -> 배열은 서로 연관된 데이터를 그루핑해서 이름을 붙인것 -> 목적:정리정돈/ 반복문은 배열과 항상 함께 다닌다.
• 반복문
  배열(array)
  데이터가 매우 많다고 가정해보자 ㅡ-> 지저분 -> 모아서 정리 & 비슷한 것끼리 묶어서 이름을 붙여 상장에 넣음 -> 군집화와 분리
  배열에 있는 값들은 순서대로 저장된다. js 에서 데이터들은 순서를 0번째부터 갖는다.
• html에서의 element 는 '태그'
  배열에서 element는 각각의 값 을 나타냄.
• for 문 - 반복문
• 위에서 var 혹은 let을 썼으면 그 밑에는 var를 썼으면 var, let을 썼으면 let을 쓰지 못한다. 생략해주거나 다른 것을 사용해야 한다.
• 'i=>' -> 구분하기위에 표시를 남겨둔거랑 마찬가지 ex) console.log('result', 1) -> result 1이라고 결과값이 나옴

> 2. 어려웠던 내용들

• var와 let의 내용이 계속해서 잘 이해가 가지 않았음.
• javascript에서 사용되는 'this'의 의미와 기능이 이해가 잘 가지 않았음.
• 오늘 배웠던 내용의 핵심인 조건문과 반복문이 어느 정도는 이해가 되었으나, 혼자서 작성을 하여 작동시키는 부분에 있어서 많이 난제가 됨.

> 3. 해결방법

• 기본적으로는 계속해서 여러 사이트를 돌며 검색을 하고 혼자서 연습을 해보는 방법 밖에 없을 것 같음.
• var와 let의 경우 < https://www.youtube.com/watch?v=61iolhWgQt0 > 이고잉님의 유튜브를 통해 일정부분 이해 중에 있음.
• 'this'의 경우도 구글링< https://www.google.com/search?q=%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8+this&oq=%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8+this&aqs=chrome..69i57j0i512l9.4608j0j7&sourceid=chrome&ie=UTF-8 >을 통해 검색을 하여 여러 설명을 보고 있음.

> 4. 학습소감

• 비전공자에, 4일차 밖에 되지 않아 여러모로 부족하고, 이해는 일정부분 가능하지만, 지속적으로 이것들을 몸이 기억할 정도로 익히기 위해선 여러 예제와 자료들을 통해 '익숙'해지는 시간이 상당히 필요할 것 같음. 3일차에도 생각했던 거지만, '첫술에 배부를 수 없다'는 것을 인지하고 차근차근 튼튼하게 집을 하나씩 지어나가는 마음가짐을 가지는 것이 중요할 듯으로 보임. 국내외 자료를 막론하고 일단은 '많이' 그리고 '자주' 보는 것이 모든 공부에 있어서의 정답이라고 생각함.