15호의 개발자

[JavaScript] forEach() 함수사용방법 자바스크립트에서 forEach() 함수는 배열 요소 만큼 함수를 실행시키는 함수이다. 예시를 바로 봐보자. 1. const array = [1, 2, 3]; function sayHello() { console.log("Hello"); } array.forEach(sayHello); 1단계. array의 요소는 3개이다. 2단계. forEach에서 실행할 함수는 sayHello이다. (sayHello뒤의 괄호()는 적지 않는다.) 3단계. sayHello를 3번 실행한다. (=sayHello를 array의 요소 개수만큼 실행한다.) 위 예시의 결과 Hello가 3번 출력된다. 2. forEach() 함수는 각 element에 접근하는 방식이다. ele..

[HTML, CSS, JS] 이모지 단축키 (mac, windows) HTML, CSS, JavaScript에서 이모지 단축키는 아래와 같다. 1. Mac ctrl + cmd + space 2. Windows 윈도우키 + . 또는 윈도우키 + ;

기본 함수 몇 가지 1탄은 아래의 링크에서 확인할 수 있다. 1탄에서 소개한 함수들 parseInt() isNaN() getElementById(), getElementByClassName() querySelector(), querySelectorAll() addEventListener() localStorage.setItem(), localStorage.getItem(), localStorage.removeItem() https://unit-15.tistory.com/entry/JavaScript-%EA%B8%B0%EB%B3%B8-%ED%95%A8%EC%88%98-%EB%AA%87-%EA%B0%80%EC%A7%80 [JavaScript] 기본 함수 몇 가지 _1탄 [JavaScript] 기본 함수 몇 ..

[JavaScript] setInterval(), setTimeout() 자바스크립트에는 일정 시간 간격으로 함수를 실행하는 기능이 있다. setInterval(), setTimeout() 메서드를 이용하면 된다. setInterval()은 일정 시간 간격(interval)을 두고 함수를 실행하게 만드는 기능이고, setTimeout()은 일정 시간이 지난 후에 함수를 실행하게 한다. 두 메서드의 문법은 아래와 같다. setInterval(함수명, interval간격) setTimeout(함수명, delay시간) 시간 간격의 기본 단위는 ms(밀리초)이다. (1000ms = 1s(초)) setTimeout 함수의 두 번째 파라미터에 다음과 같이 0을 넣으면 delay 시간이 0이 되므로 함수는 바로 실행..

[JavaScript] toggle 메서드 toggle은 h1의 classList에 clicked class가 있는지 확인 있으면 clicked를 제거 없다면 clicked를 classList에 추가 toggle은 on/off처럼 껐다 켰다(왔다 갔다)하는 기능이다. 토글 버튼은 on/off처럼 두 상태 중 하나를 선택할 때 사용하는 버튼이다. 보통 아래와 같이 classList를 이용하여 많이 쓰고, click 이벤트와 함께 많이 사용한다. function 함수명() { 태그명.classList.toggle("클래스명"); } 변수명.addEventListener("클래스명", 함수명);

[JavaScript] 기본 함수 몇 가지 _1탄 1. parseInt() parseInt() 함수는 string을 number로 변환하는 함수이다. const a = 123; const b = "123"; const c = "Hello"; const d = true; const e = false; const f = null; console.log(parseInt(a)); // 123 console.log(parseInt(b)); // 123 console.log(parseInt(c)); // NaN console.log(parseInt(d)); // NaN console.log(parseInt(e)); // NaN console.log(parseInt(f)); // NaN NaN은 Not-A-Numbe..

[JavaScript] 자바스크립트 놓치기 쉬운 기본 개념들 1. const vs let const는 상수를 입력할 때 쓰인다. 상수란 변하지 않는 값으로, 한 번 정하면 나중에 바꿀 수 없다. const a = 5; console.log(a+a) // 10 const a = 10; console.log(a+a) // Assignment to constant variable. 에러 위의 예시처럼 a를 const로 정해놓고 5를 입력했으면 이후 이 값은 바뀔 수 없다. 이 a값을 10으로 바꾸려 했더니 Assignment to constant variable. 에러가 떴고, 이는 상수값에 값을 적용하려 했다는 의미의 에러이다. 값을 마음껏 변경하고 싶은 변수값을 입력하려면 const가 아닌 let을 이용해..

[JavaScript] parseFloat() 사용법 parseFloat()는 문자열을 부동소수점(실수)으로 변환해주는 함수이다. 형식은 다음과 같다. parseFloat( string ) 띄어쓰기로 여러 개의 숫자가 이어져 있으면, 첫 번째 숫자만 바꾼다. 첫 문자가 숫자가 아닌 경우, NaN을 반환한다. (숫자로 변환할 수 있는 값도 해당됨) (ex) string = '12.345' 인 경우 : 12.345 반환 string = '12.345abcde' 인 경우 : 12.345 반환 string = "12.345 7.789" 인 경우 : 12.345 반환 string = "abc 12.345" 인 경우 : NaN 반환

[JavaScript] return문 설명 return은 함수에서 반환하는 값을 정할 때 사용한다. return 반환값; function add(num1, num2) { add = num1 + num2; return add; } 위와 같이 코드를 짜면 add(=num1+num1) 값이 반환된다. num1=1, num2=2 이면 add=3이므로 3이 반환된다. 하지만, return 뒤에 add가 아닌 0을 입력하면, num1과 num2을 더한 add 값이 5이든 100이든 1000이든 항상 0이 반환되게 된다. function add(num1, num2) { add = num1 + num2; return 0; } 또한, return 뒤에 아무것도 입력하지 않으면 add에 num1과 num2를 더한 값이 저..

[JavaScript] ===와 ==의 차이 (Identity vs Equality) == (Equality) 같음을 비교할 때 쓰이며, 같으면 true, 다르면 false를 반환한다. 타입 검사는 하지 않는다. === (Identity, Strict Equality) ===는 Identity라고 부르며, Strict Equality라고도 부른다. 즉, 같음을 비교할 때 ==보다 더 엄격하게 한다. 타입 검사도 하므로 같은 형식이어야 한다. 1 2 3 4 5 6 7 8 9 10 123 == '123' // true 123 == new String("123") // true '123' == new String("123") // true null == undefined // true 123 === '123'..