프론트엔드/JavaScript56 메소드 체이닝 메소드 체이닝: 여러 메소드를 연결하는 것 const a ='Hello ~ '; // split: 문자를 인수 기준으로 쪼개서 배열로 반환. // reverse: 배열을 뒤집기. // join: 배열을 인수 기준으로 문자로 병합해 반환. const b = a.split('').reverse().join(''); // 메소드 체이닝 console.log(a); // Hello ~ console.log(b); // ~ olleH 2021. 5. 11. DOM API DOM API: Document Object Model, Application Programming Interface (자바 스크립트에서 HTML을 제어하기 위한 여러 명령들) 1가지 특정 클래스(같은 이름이 있을 경우 맨 처음 클래스 선택) 검색 // HTML 요소 (Element) 1개 검색/찾기 let boxEl = document.querySelector('.box'); console.log(boxEl); // HTML 요소에 적용할 수 있는 메소드 boxEl.addEventListener(); // 인수(Arguments)를 추가 기능 boxEl.addEventListener(1, 2); // 1 - 이벤트(Event, 상황) boxEl.addEventListener('click', 2); //.. 2021. 5. 10. 조건문 조건문: 조건의 결과(truthy, falsy)에 따라 다른 코드를 실행하는 구문 (if, else) 조건이 true 일 경우 해당 실행 구문이 동작하는 예제 let isShow = true; let checked = false; if (isShow) { console.log('확인'); } if (checked) { console.log('확인2'); } let isShow = true; let checked = false; if (checked) { console.log('확인'); } else { console.log('확인2'); } 2021. 5. 10. 함수 함수: 특정 동작(기능)을 수행하는 일부 코드의 집합(부분) (function) 함수 호출 예제 // 함수 선언 function helloFunc() { // 실행 코드 console.log(1234); } // 함수 호출 helloFunc(); //1234 return 함수 예제 // 함수 선언 function returnFunc() { // 실행 코드 return 123; } let a = returnFunc(); console.log(a); 매개변수가 있는 함수 예제 // 함수 선언 // a와 b는 매개변수(Parameter) function sum(a, b) { // 실행 코드 return a + b; } // 재사용 let a = sum(1,2); // 1과 2는 인수(Arguments) let.. 2021. 5. 10. 변수 변수: 데이터를 저장하고 참조(사용)하는 데이터의 이름 (var, let, const) // 재사용이 가능! // 변수 선언! let a = 2; let b = 5; console.log(a + b); // 7 console.log(a - b); // -3 console.log(a * b); // 10 console.log(a / b); // 0.4 // 값(데이터)의 재할당 가능! let a = 12; console.log(a); // 12 a = 999; console.log(a); // 999 // 값(데이터)의 재할당 불가! const a = 12; console.log(a); //12 a = 999; console.log(a); //Type Error 새롭게 값을 할당해야 할 경우 let 사용 .. 2021. 5. 10. 자료형 String(문자 데이터): 따옴표를 사용 let myName = "hello1"; let email = 'hello@gmail.com'; let hello = `Hello ${myName}?!`; // 보간법 (백틱 기호 사용) console.log(myName); console.log(email); console.log(hello); Number(숫자 데이터): 정수 및 부동소수점 숫자를 나타냄 let number = 123; let opacity = 1.57; console.log(number); console.log(opacity); console.log(number + opacity); Boolean(불린 데이터): true, false 두 가지 값밖에 없는 논리 데이터 let checked =.. 2021. 4. 29. 이전 1 ··· 6 7 8 9 10 다음
