localhost 우리가 작업하고 있는 본인의 컴퓨터 자체를 가리키는 주소 127.0.0.1이라고 하는 ip주소로도 표현된다. localhost == 127.0.0.1 이 둘이 같다는 것ㅇ르 이해하기 위해서는 DNS라는 개념이 필요하다 DNS Domain Name System ip주소를 도메인이라는 주소로 변환해주는 것 127.0.0.1 → localhost localhost:5500 localhost 뒤에 숫자 : 포트 번호 5500 : live server가 사용하기 위해 설정해둔 번호 포트 번호 localhost로 통하는 여러 개의 문 중 하나 구글 같은 경우 url에 보면 자물쇠 표시가 있다. 이 경우 포트번호 443을 이용한다. 자물쇠가 없는 사이트는 80번 포트를 이용한다 자물쇠 O : htt..

함수 표현식 : 변수에 함수를 할당하는 방식 1 2 3 4 const sum = function() { let result = 10+10; } cs 함수선언문 : function을 먼저 적고 이 뒤에 함수의 이름이 적힌다. 1 2 3 4 function sum() { let result = 10+10; } cs 차이점 선언키워드 : 표현식 O / 선언문 X 호이스팅의 영향 : 표현식 X / 선언문 O 호이스팅 :위로 끌어올려지는 것 JS는 위에서부터 한줄씩 코드를 읽어내려온다. 브라우저가 자바스크립트를 해석하는 과정에서 선언문으로 작성된 함수는 원래 선언된 위치가 아니라 위쪽으로 끌어올려지게 된다. 1 2 3 4 5 6 sum() function sum() { let result = 10+10; } cs..

return 데이터를 반환해줌 함수를 종료시킴 return을 통해 함수 밖에서 함수 내부에 있는 변수 데이터를 꺼내올 수 있게 되었다. 그리고 return은 함수를 종료시키기 때문에 아래의 console.log는 실행되지 않는다. 지난번에는 counterMaker에서 dateFormMaker함수를 실행시킬 수 없었는데 이번에는 return을 통해 값을 얻어올 수 있어 실행 가능하다. 변수들을 문자열로 연결할 때 ' '와 +를 이용하여 표현했는데 `(백틱)을 이용하면 그 자체로 문자열로 받아올 수 있다. return을 통해 함수 내부에 존재하고 있는 변수 데이터를 꺼내오고 데이터 받아와서 newDate()라는 함수에 대입해 목표한 날짜까지 남은 시간을 구해냈다. 그러나 지금은 한국 표준 시간을 이용하기 때..

자바스크립트에는 Date라고 하는 날짜 객체가 존재한다. Date 원하는 시간대를 날짜 형식에 맞춰 데이터로 돌려준다. 안에 날짜 함수 counterMaker 추가 후 버튼과 연결 버튼을 누를 때마다 누른 시간이 출력된다. 현재시각 뿐만 아니라, 특정 시각도 받을 수 있다. new Date('yyyy-mm-dd') → 소괄호 안에 날짜 형식을 맞춰서 문자열로 특정값을 넣어준다. 목표시간까지 남은 시간도 구할 수 있다 목표시간 - 현재 시간 목표시간까지 도달할 때까지의 초(0.0001초까지) 온전한 초로 사용하려면 나누기를 통해서 0초 이하의 시간대는 소수점 이하로 수를 내려줘야 한다. 남은 시간 구하기 : 초 / 3600 남은 일수 구하기 : (초 / 3600) / 24 크리스마스까지 33일 남았다는 것..

태그에 대해 알아보자. 우선, 코드 정리를 했다. 태그 텍스트를 입력받는 공간 그 공간에 어떤 텍스트가 입력되었는지 js에게 알려주기 위해서는 먼저 공간의 데이터를 소유하고 있어야 한다. 해당 데이터를 참조하고 소유하는 방법 console.log(document) 라고 입력하자 현재 내가 작성 중인 html의 내용이 출력됐다. document란 객체의 일종으로, 에 입력되어 있는 값을 데이터로 가져올 수 있다. querySelector() 태그들을 그대로 본인이 있는 영역으로 가져올 수 있다. () 안에 해당 태그를 적으면 되는데 태그가 여러 개 있을 경우 id 또는 class로 적어서 특정한다. id가 들어갈 경우 : #아이디명 class가 들어갈 경우 : .클래스명 버튼을 누르면 태그 자체가 가져와버..

onClick 태그에 속해있는 속성 버튼이 클릭되었을 때 안쪽 코드가 실행된다. 버튼을 누르면 console.log가 실행된다. 지난 게시물에서 만든 output 함수와 연결해보자. 함수 실행시키기 → 함수명() 버튼을 누를 때마다 output 함수가 실행된다