목록Front-end (103)
NULL
동등 / 일치 비교 연산자 비교 연산자 의미 사례 설명 == 동등 비교 x == y x와 y의 값이 같음 === 일치 비교 x === y x와 y의 값과 타입이 같음 != 부등 비교 x != y x와 y의 값이 다름 !== 불일치 비교 x !==y x와 y의 값과 타입이 다름 동등 비교 (==) 연산자는 피연산자를 비교할 때 암묵적 타입 변환을 통해 타입을 일치 시킨 후 같은 값을 갖는지 비교한다. 따라서 동등 비교 연산자는 피연산자가 타입은 다르더라도 암묵적 타입 변환 후 같은 값이라면 true를 반환한다. // 동등 비교 5 == 5 // true // 타입은 다르지만 암묵적 타입 변환을 통해 타입을 일치시키면 같은 값을 같는다. 5 == '5' //true 5 == 8 // false 하지만 동등 ..
동적 타이핑 JS는 C, JAVA와 다르게 변수 선언할때 미리 타입을 정하지 않는다. 변수에 할당된 값에 의해 타입이 결정된다.
var text1 = ' test '; var text2 = '\ttest\t'; var text3 = '\ntest\n'; text1.trim(); // test text2.trim(); // test text3.trim(); // test 위 코드는 모든 앞 뒤의 공백을 제거할 수 있는 예제입니다. 문자열 앞 뒤에 공백이 중복되어 여러 개가 있어도 모두 제거됩니다.
const id = document.getElementById("id"); const pwd = document.getElementById("ps"); const login = document.getElementById("login"); const form = document.querySelector(".login__container__input"); form.addEventListener("submit", function(event) { // form submit 이벤트 발생 시 if (id.value.trim() == "") { // 만약 id값이 공백이라면 alert("아이디를 입력해주세요."); // 경고창 출력 event.preventDefault(); // form submit 함수 실행중지 ..
keydown 키를 눌렀을 때 작동한다. keyup 키를 눌렀다가 땠을 때 작동한다. keydown, keyup와 는 달리 input이벤트는 방향키가 먹히지 않는다.
.push() 배열의 맨 뒤에 인자를 추가한다. .unshift() 배열의 맨 앞에 인자를 추가한다. .pop() 맨뒤 인자값을 지운다. .isArray() 배열인 경우 true 아닌 경우 false를 반환한다. .indexOf() 는 배열안의 특정 값이 몇번째 인덱스에 있는지 반환해준다. .splice(0, 2) 라면 0번째 인덱스부터 2번째 인덱스까지 뺀 나머지 값을 반환한다. (배열 자체를 바꿈) .slice() 마찬가지로 .slice(0, 2)라면 0부터 2인덱스까지 짤린 값만 반환받는다. 배열을 바꾸지 않고 값만 반환해서 값을 저장할 변수가 필요하다. (배열을 바꾸지는 않고 값만 반환)
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/P1PPP/btryKuUEAXH/4MUk4kbHeKag5zbi9uyuTk/img.png)
호이스팅이란? 변수나 함수 선언문 등 모든 선언문이 해당 스코프의 선두로 옮겨진 것처럼 동작하는 것을 말한다. 즉, js의 모든 선언문(var, let, const, function*, class)이 선언되기 이전에 참조 가능하다. 선언된 변수는 선언단계와 초기와단계가 한번에 이뤄진다. 즉, 스코프에 변수가 등록되고 변수는 메모리 공간을 확보한 후 undefined로 초기화한다. 따라서 변수 선언문 이전에 변수에 접근하여도 Variable Object에 변수가 존재하기 때문에 에러가 발생하지 않는다, 다만 undefined를 반환한다. 이러한 현상을 변수 호이스팅이라고 한다.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/mFIz4/btrqxS9GeO5/iUMa3dbcebdFuAXqCSRBok/img.png)
let fruits = "사과, 딸기, 포도, 참외"; fruits = fruits.split(", "); console.log(fruits); 특정값을 .split()값으로 짤라서 배열에 저장한다. fruits.split(", ")는 변수 fruits의 문자열안의 값을 ", " 단위로 짤라서 배열에 저장한다. 따라서 결과물은 "사과, 딸기, 포도, 참외" 문자열에서 ", "단위로 짜른 "사과" "딸기" "포도" "참외" 값이 각각 배열의 0번째 인덱스부터 저장된다.
var은 글로벌화되서 어떤 지역에서든 변수가 유효하며, 변수를 한번 더 선언해도 에러가 나오지 않거나 다른 값이 출력되는 것을 볼 수 있다. 간단한 테스트에서는 편리 할 수 있지만 코드량이 많아지면 어디에 어떻게 사용 될지 파악하기가 힘들어지며 값이 바뀔 수도 있다. 그래서 ES6이후 이와 같은 문제를 보완하기 위해 let, const가 나왔다. let은 변수 재할당은 가능하지만 재선언은 불가능하다. 이때 변수의 스코프는 최대한 좁게 만든다. const은 재할당, 재선언이 불가능하며, 재할당이 필요없는 상수와 객체에 사용한다. var는 동일한 변수명으로 재선언이 가능하지만 let은 동일한 변수명으로 재선언 할 시 오류가 발생한다. var a = 1; console.log(a); // 1 var a = 2..