자바스크립트(14)
-
[JS] 반복문
1. for loop 가장 일반적인 for문 var arr = []; for(var i=0; i
2020.11.11 -
[JS 객체(Object)
object = {key : value}; 1. Literals and properties 1-1. Object의 사용 보통 primitive타입은 변수 하나당 값을 하나만 할당할 수 있는데, 이 변수들을 출력하고자 함수를 정의해서 호출한다면 출력하고자 하는 변수들이 굉장히 많아질 수 있고 비효율적일 수 있는데 이럴 경우 객체(Object)를 활용하면 위의 문제점들을 개선할 수 있음 const name = "ellie"; const age = 4; print(name, age); function print(name, age) { console.log(name); console.log(age); } function printObject(person) { console.log(person.name); con..
2020.06.18 -
[JS] javascript:void(0) 과 #
javascript:void(0) ' javascript: '을 사용할 경우 해당 구문이 스크립트로 평가되어 실행되어 도큐먼트의 내용으로 표시됩니다. ' javascript:void(0) '을 사용할 경우에는 스크립트의 평가 결과로 'undefined'가 반환되어 무시되므로 현재 페이지가 유지됩니다. 주의할 점은 CSP(Content Security Policy)의 설정에 따라서는 Inline Event Handler가 블럭될 수 있습니다. (물론 void이므로 블럭된다해서 문제될 것은 없을 수 있지만 보안툴 등에 의해 경고가 출력될 수 있습니다. #(hash) ' #(hash) '는 보통 페이지 내부링크를 목적으로 사용되는데 id를 지정하지 않은 경우에는 해당 페이지의 최상단으로 스크롤됩니다. 기본동작..
2020.06.08 -
[Javascript] classList
classList : 클래스를 조작하는 다양한 메서드들을 사용가능 .add() .remove() .contains() .toggle() classList.add() 클래스를 필요에 따라 삽입 const toggleBtn = document.querySelector(".navbar_toggleBtn"); const menu = document.querySelector(".navbar_menu"); toggleBtn.addEventListener("click", () => { menu.classList.add("active"); //menu에 active클래스추가 }); classList.remove() 클래스를 필요에 따라 삭제 const toggleBtn = document.querySelector("...
2020.06.08 -
[JS] 클래스(Class)
객체지향프로그래밍(Object-oriented programming)에서 class는 template이고, object는 instance of a class입니다. 그렇다면 Javascript에서 class는? -introduced in ES6 -자바스크립트에서는 기존에 클래스가 존재하지 않다가 'ES6'에서 추가됨 (클래스가 도입되기 전에는 클래스를 만들지 않고 바로 Object를 만들 수 있었고, 이 Object를 만들 때 Function을 이용해서 템플릿을 만드는 방법이 있었음) -syntactical sugar prototype-based inheritance -클랫는 완벽하게 짠하고 추가된 것이 아니라 기존에 있던 자바스크립트에 추가된 것이기 때문에 기존에 존재하던 prototype을 베이스로 ..
2020.06.04 -
[JS] 반복문(Loops)
1. while while the condition is truthy, body code is executed. let i = 3; while(i>0){ console.log(`while:${i}`); i--; } //while:3 //while:2 //while:1 2. do while body code is executed first, then check the condition let i = 1; do { console.log(`do while:${i}`); i--; } while(i>0); //do while:0 3. for for(begin;condition;step) begind은 딱 한번만 실행하고 블럭을 실행하기 전에 condition체크하고 블럭을 실행하고 step진행 i에 '3'을 대입..
2020.05.31