ucong97

1. 산술연산자 연산자 이름 목적 예시 값 + 더하기 두개의 숫자를 더한다 4 + 5 9 - 빼기 왼쪽에 있는 수를 오른쪽 수로 뺀다 21 - 17 4 * 곱하기 두 개의 숫자를 곱한다 2 * 8 16 / 나누기 왼쪽의 숫자를 오른쪽 숫자로 나눠서 '몫'을 구한다 10 / 3 3.333 % 나머지 왼쪽의 숫자를 오른쪽 숫자로 나눠서 '나머지'를 구한다 8 % 3 2 ** 지수 왼쪽의 숫자를 오른쪽 숫자만큼 제곱한다 5**2 25 2. 증감연산자 연산자 이름 목적 예시 값 ++ 증가 연산자 변수값에 1을 더한다 count++ count + 1 -- 증감 연산자 변수값에 1을 뺀다 count-- count - 1 ※ 후위 연산자 VS 전위 연산자 후위 연산자 전위 연산자 설명 연산자가 변수의 뒤에 위치 변수..

삼항연산자란? - 세개의 피연산자를 받는 유일한 연산자 - if ... else 문의 대체재로 사용된다 구문 표현 조건문 ? 참일 경우 실행할 표현식 : 거짓일 경우 실행할 표현식 예제 - 삼항 연산자 사용 function example(name){ return name === 'ucong' ? 'yes' : 'no'; } console.log('ucong'); // output: 'yes' console.log('babo'); // output: 'no' console.log(null); // output: 'no' - 다중 삼항 연산 function example(num){ return num > 0 ? 'num은 숫자 0보다 큽니다' : num < 0 ? 'num은 숫자 0보다 작습니다' : 'nu..

메소드 설명 Math.min(x,y, ...) 인수로 전달받은 값 중에서 가장 작은 수를 반환. Math.max(x,y, ...) 인수로 전달받은 값 중에서 가장 큰 수를 반환. Math.round(x) x를 소수점 첫 번째 자리에서 반올림하여 그 결과를 반환. Math.floor(x) x와 같거나 작은 수 중에서 가장 큰 정수를 반환. Math.ceil(x) x와 같거나 큰 수 중에서 가장 작은 정수를 반환. Math.round() 0보다 크거나 같고 1보다 작은 랜덤 숫자를 반환. Math.trunc(x) x의 모든 소수 부분을 삭제하고 정수 부분만 반환 Math.floor() VS Math.trunc() >>> Math.floor(-3.14) # 결과 : -4 >>> Math.trunc(-3.14)..

For/Of 루프 - 반복 가능한 개체의 값을 반복 - Arrays, Strings, Maps, NodeLists 등과 같이 반복 가능한 데이터 구조를 반복 for (variable of iterable) { } 배열에 대한 루핑 const fruit = ["apple", "banana", "mango"]; let text = ""; for (let x of fruit) { text += x + " "; } 문자열 반복 let language = "JavaScript"; let text = ""; for(let x of language){ text += x + " "; } * for ... in 과의 차이 - for ... in 같은 경우는 인덱스를 반환 - for ... of, Array.forEach..

화살표 함수 - 함수 표현식을 작성하기 위한 짧은 구문을 허용 - function 키워드, return 키워드 및 중괄호 불필요 이전 ES6 hello = fuctnion() { return "Hello World!"; } hello = () => { return "Hello World!"; } - 매개변수가 없는 경우 hello = () => { return "Hello World!" }; - '{} 안에 한줄'일때 ,다음과 같이 중괄호와 return 을 생략가능 hello = () => "Hello World!"; - 매개변수가 있는 경우 hello = (val) => "Hello" + val ; - 매개변수가 '하나만' 있는경우, 다음과같이 () 생략 가능 hello = val => "Hello" ..

let 재선언 불가 let x = "ucong"; let x = 0; // SyntaxError : x 는 이미 선언되었습니다. 블록 범위 제공 - {} 블록 내부에 선언된 변수는 블록 외부에서 액세스 불가능 { let x = "ucong"; } // x 는 이곳(블록 범위 밖)에서 사용 불가능 * var같은 경우는 {} 블록 내부에 선언된 변수도 블록 외부에서 액세스 가능 변수 재선언 - 블록 내부의 변수를 다시 선언해도 외부의 변수는 다시 선언되지 않음 (var의 문제점 개선) let x = 1; // x=1; { let x = 2; // x=2; } // x=1; let 호이스팅 - let이 맨위로 호이스트 되지만 초기화 되지 않음 - let 변수를 선언하기 전에 사용 불가 alert(bananaC..

ES6(ECMAS6) 문법이란? - ECMAScript 2015로도 알려져있는 ECMAScript 표준의 오늘날짜 기준으로 가장 최신 버전 - JavaScript의 두 번째 주요 개정판 ES6의 새로운 기능 - let과 const 키워드 - 화살표 함수 - For / Of 루프 - 템플릿 리터럴 - 기본 매개 변수 - 배열 및 객체 비구조화 - 가져오기 및 내보내기 - 프로미스 - 나머지 매개 변수 및 확산 연산자 - 클래스

GSAP( The GreenSock Animation Platform ) - 프론트엔드 개발자와 디자이너들이 쉽게 사용할 수 있는 아주 강력한 타임라인 기반의 애니메이션 자바 스크립트 라이브러리 CDN 이용해 추가방법

CSS div{ width : 100px; } 여기서 100 이라는 숫자만 가져오고 싶다면, JS var num = parseInt($('div').css('width').replace(/[^-\d\.]/g, ''),10); - parseInt 를 해주지않으면 "100" 이라는 결과를 가져온다. (따옴표도 같이 출력됨)

자바스크립트 (JavaScript) - 동적으로 컨텐츠를 바꾸고, 멀티미디어나 움직이는 이미지 등 웹페이지를 꾸며주도록 도와주는 언어 ex ) 팝업창 띄우기, 애니메이션 효과, 통신 등 - 객체기반의 스크립트 언어, HTML 문서 내에 내장되어 프로그래밍 요소 추가 가능 장점 단점 - HTML 파일 내에서 작성하고 바로 작동시켜 볼 수 있기 때문에 개발속도가 빠름 - 웹 브라우저에서 동작해 운영체제의 제한을 받지 않고, 여러 환경에서 개발 가능 - 프론트 엔드 언어이지만 Node.js 프레임워크를 이용해 백엔드 개발에서도 사용가능 - 웹 브라우저 상에 소스 코드가 노출되어 있어 보안에 취약하다. - 컴파일하지 않아도 되기 때문에, 복사하여 그대로 사용 가능 - 한정된 객체, 함수를 제공하기 때문에 개발시..