Mong dev blog

밀리초를 날짜로 바꾸는 법 오늘은 밀리초를 받아서 년.월.일.요일을 출력하는 함수를 만들어보자! 1. Date 객체 생성하기 new Date() : new Date()를 사용하면 Date객체를 만들 수 있다. : 이 Date 객체에 인자를 넘기지 않으면 현재 날짜, 시간이 출력된다. let nowDate = new Date(); console.log(nowDate); //Thu Apr 29 2021 19:58:14 GMT+0900 (대한민국 표준시) new Date(밀리초) : 밀리초는 1970년 1월 1일 0시 0분 0초 후의 시점이다. : new Date에 밀리초를 넘기면, 밀리초를 시간으로 변환해준다. let milliseconds = 203010231540; let date = new Date(m..

arrow, normal function의 차이 기존에 js에서 사용하던 함수구문을 arrow function 방식을 이용해 더 간결하게 작성할 수 있게 되었다. 하지만 이 arrow function! 사용하다보면, 이게 안된다고? 하는 순간이 있다. 오늘은 이 arrow function과 normal function의 차이점을 알아보자! 1. arrow function 선언 방식 arrow function의 큰 장점이자, 선호이유는 간단한 구문 때문일 것이다. 아래 코드는 arrow function 구문을 작성하였다. (1). 매개변수 여부 : 매개변수 개수에 따라 표현 구문이 달라질 수 있다. //매개변수 0개 (소괄호 필요) () => {...} //매개변수 1개 (소괄호 생략가능) (x) => {..

1. 여러 인자 넘기기 : 코드를 짜다보면 여러 인자들을 함수에 넘겨야할 때가 있다. : 어쩌면 아래와 같이 넘길지도 모른다. function A() { let a = [1,2,3,4]; let b = {a: 1, b:2}; let c = 'hello'; let d = 21; B(a,b,c,d); } function B(a, b, c, d) { console.log(a, b, c, d); } 인자를 넘기는 또 다른 방법은 뭐가 있을까? : 아래와 같이 쓰는 방법도 있을 것이다. : 변수를 객체에 담아 보내는 방식으로, 인자가 일일이 쓰지 않아도 된다. : 또한, 인자가 더 늘어날 시 함수내부 코드만 수정하면 된다. function A() { let a = [1,2,3,4]; let b = ..

1. or연산자와 조건문 : 어느날, 조건문을 만들고 있었다. : 그런데, 오잉? 조건에 만족하는데 작동이 안되는 것이 아닌가..! world가 B일 때, 왜 success가 출력이 안되지? function hello(world) { if (world === 'A' || 'B') { console.log('success') } } : 문제는 바로 or연산자를 제대로 이해하지 못했던 것! : JS에서 or연산자를 사용해 여러 조건을 체크하려면 아래와 같이 써야 한다. function hello(world) { if (world === 'A' || world === 'B'){ console.log('success'); } ..

1. ES21, 논리연산자 (1) &&= : 첫 번째 변수가 true이면, 두 번째 변수를 할당한다. //before let one = true; let two = 13; if (one) { one = two; } console.log(one); //13 //after let one = true; let two = 13; one &&= two; console.log(one); //13 (2) ||= : 첫 번째 변수가 false이면, 두 번째 변수를 할당한다. //before let one = null; let two = 13; if (one) { one = two; } console.log(one); //13 //after let one = null; let two = 13; one &&= two; c..

1. a 태그에 margin 주는 법 아래표는 태그별 display를 보여준다. display 태그 종류 특징 block div, p, h1, li 등 - 가로 영역을 모두 채움 - block 요소 다음에는 줄바꿈이 됨 - width, height 속성을 지정 가능 inline span, b, i, a 등 - 줄 바꿈이 되지 않음 - width와 height를 지정 못함. a 태그는 display: inline이므로 기본적으로 여백을 줄 수 없다. 하지만, a태그에 display: inline-block를 하면 여백(margin)을 줄 수 있다! 2. 페이지 나가기 전 이벤트 처리는? html의 생명주기에는 아래와 깉이 3가지 이벤트가 발생한다. 이벤트명 설명 DOMContentLoaded - DOM이 ..