반응형

Part 2. JavaScript Essentials 7

Ch 3. JS 함수-04.호이스팅

#호이스팅(hoisiting) 함수 선언부가 유효범위 최상단으로 끌어올려지는 현상 함수 선언부가 유효범위라는 거 우리가 예전에 배웠죠? 영어로는 스콥이라고 하고요. 그래서 그 유효범위 최상단으로 끌어올려지는 현상을 얘기한데요. 이것이 무엇인지 아래쪽에 코드를 통해서 살펴볼건데요. #실습준비 const a = 7 const double = function () { console.log( a * 2 ) } double() double이라는 변수에 익명함수가 할당되었습니다. 함수표현이 완성되었습니다. 그리고 double이라는 함수가 호출되고 있습니다. 14가 출력되었습니다. #호이스팅 개념 const a = 7 double() const double = function () { console.log( a * ..

Ch 3. JS 함수-03.IIFE(즉시실행함수)

[목차] #IIFE(즉시실행함수) 의미 #실습준비, 즉시실행함수를 쓰는 목적설명 #이럴 때 즉시실행함수 사용법 첫번째 #즉시실행함수와 세미콜론 #즉시실행함수 사용법 두번째 #IIFE(즉시실행함수) 의미 말 그대로 어떤 특정한 함수를 즉시 실행 해 버릴 수가 있겠구요. Immediately-Invoked Function Expression #실습준비, 즉시실행함수를 쓰는 목적설명 a라는 변수가 선언이 되었고요, 숫자 7을 할당해서 담았습니다. 그리고 double()이라는 함수를 만들어서 그 내부에서 console.log로 a * 2를 출력합니다. 그 함수 자체를 아래쪽에서 이렇게 double()이라는 이름으로 실행해서 로직이 구성되었습니다. const a = 7 function double() { cons..

Ch 2. JS 시작하기-07.조건문 Switch

#조건문 Switch switch (a) { case 0: console.log('a is 0') break case 2: console.log('a is 2') break case 4: console.log('a is 4') break default: console.log('rest...') } switch문에는 a라는 변수만 집어 넣어줍니다. 그 a라는 변수가 상황에 따라서 어떠한 값인지를 우리는 case라는 키워드를 통해서 명시 할 수 있어요, case 0: (a라는 조건이 숫자데이터 0인 경우에 해당하는 내용을 작성할 수 있고요.) console.log('a is 0') (a가 0인 경우에 'a is 0'를 출력하고요.) 그리고 하나의 케이스의 내용이 끝나면 그것이 끝났다는 표시로 break 키워..

Ch 2. JS 시작하기-06.조건문 IF Else

#실습준비 *getRandom.js 파일을 새로 만듭니다. 코딩을 합니다. export default function random() { return }; #Math.floor(Math.random() * 10) ( return할 값은 개발자도구의 콘솔창에서 직접적으로 코딩을 해 볼게요. ) #Math.random() 대문자로 시작하는Math라는 수학객체가 하나 있습니다. 메소드로 random()을 실행해줄 수 있습니다. 여기다가 곱하기 10을 하면 Math.random() * 10 정수부분에도 숫자가 잘 나오게 되는데요. #소수점 부분 숫자는 버려주는 Math.floor(Math.random() * 10) Math 객체의 내림처리를 해주는 메소드 floor 를 사용합니다. #.getRandom.js파일..

Ch 2. JS 시작하기-05.삼항 연산자

#삼항연산자(ternary operator) if의 첫번째 블럭이 실행되어서 true가 나왔습니다. 우리는 어떤 특정한 조건이 참인지 거짓인지 확인을 해서 그것을 조건을 가지고서 어떤 코드를 실행 할 수 있는데요, 그것을 조건을 가지고서 어떤 코드내용을 실행하면 5줄정도 사용하죠. 위 조건문의 코드를 삼항 연산자로 더 간단하게 만들 수 있습니다. console.log(a ? '참' : '거짓'); a ? '참' : '거짓' 말 그대로 3개의 항이 있는 거고요. if else 조건문이 훨씬 더 직관적으로 보일 수도 있겠지만, 비교적 단순한 조건 같은 경우에는 이렇게 3항의 연산자를 통해서 우리가 조건을 만들어낼 수가 있겠습니다. **의미해석** a ?는 물음표를 기준으로 그 앞의 값을 확인해야합니다. a가..

Ch 2. JS 시작하기-01.개요(ECMA Script) 및 프로젝트 초기화

#ECMA Script(에크마 스크립트) ES라고도 부른다. 유럽컴퓨터제조협회의 약어. 자바스크립트를 표준화 해 주는 국제 표준화 기구. ES6 나 ES2015는 버전이라고 생각하시면 됩니다. #1997년 이래로 계속 버전이 추가되고 있다. ES6 ES2015때 크게 바뀌게 되었다. JS5.1(2011)과 ES6(2015)버전 사이에 있는 차이점을 주목해야한다. 그 전후로 구버전 신버전을 구분한다. 이 때 크게 바뀌었다. JS를 개발할 때 어떤 버전인지 확인한다. #. 바벨이라는 플러그인 바벨이라는 플러그인 바벨이라는 플러그인의 도움을 받아서, 6버전 이후의 최신버전의 기술들을 구형브라우저에서도 동작할 수 있는 5버전 때의 자바스크립트의 문법으로도 변환시켜줄 수가 있겠고, 우리는 최신 기술로 작성을 하고..

Ch 1. Node.js -04.NPM 개요(2)

#. npm init -y 로 {} package.json 파일이 생성 test 폴더를 만들어서, 터미널을 열어주세요. nodejs를설치했으면 npm도 설치됩니다. npm init -y를 입력하면 ( npm init 를 입력하고 -y 플래그를 입력합니다. ) 그러면 옆에 {} package.json 파일이 생성되는 것을 볼 수 있습니다. 안 나오면 새로고침 누르세여. # {} package.json 파일 상세보기 name: test ,폴더명이고요. 다른이름으로 바꿔도 사용해도됩니다. version: 1.0.0 ,프로젝트 버전도 나오고요 description: "" 프로젝트에 대한 설명 main: index.js 우리도 직접 패키지를 만들어서 사용할 수 있는데요, 현재의 프로젝트를 하나의 패키지처럼 만들어..

반응형