본문 바로가기

Web

(104)
함수 정의 함수 정의 - 함수 선언문 function a(){} - 함수 표현식 var a = function(){} -new function - 문자열로 작성 엔진 해석 -함수 선언문 먼저 해석 -함수 표현식 해석 function sports(){ debugger; var player = 11; function soccer(){ return player; }; var swim = function(){}; soccer(); } sports(); 해석단계 1. 함수 선언문 해석 2. 변수 초기화 -undefined 값 할당 3. 자바스크립트 코드 실행 function sports(){ baseball(); function baseball(){} } 이런 개념을 호이스팅 함수 선언문 오버라이딩 function test..
타입스크립트 소개 - 타입스크립트는 자바스크립트를 확장한 언어- 자바스크립트 언어의 특성을 침범하지 않고 최신 ECMA 표준을 지원- 타입 기반 언어 (타입스크립트 = 자바스크립트 + 타입)- 자바스크립트의 타입 검사 남발 방지- 변환 도구를 이용해 다른 언어로 변환이 가능
Angular CLI 소개 Angular CLI (Command Line Interface) ?- 개발자가 Angular 개발에만 집중할 수 있도록 개발에 필요한 Angular 프로젝트의 설정이나 프로젝트의 전반적인 관리를 명령어 기반으로 수행할 수 있게 지원 제공하는 기능- Angular 프로젝트 생성- Angular의 중요 구성요소 추가(컴포넌트, 지시자, 파이프, 서비스)- 코드 변경 시 빌드를 수행하고 애플리케이션을 재시작- 브라우저 동기화- 단위 테스트, 종단 테스트와 같은 테스트 환경 제공- 프로젝트 배포를 위한 패키징 공식 홈페이지 : https://cli.angular.io깃허브 프로젝트 : https://github.com/angular/angular-cli
개발 준비 1. Node.js 설치 (https://nodejs.org/ko)- npm 업데이트 $ npm install -g npm@latest 2. NPM을 이용한 개발서버 실행- package.json 파일 생성 $ npm init 3. 타입스크립트 설치 $ npm install -g typescript $ tsc -v 4. Angular 프로젝트 구성- Angular CLI 설치 $ npm install -g @angular/cli - Angular CLI 프로젝트 만들기 $ ng new my-app $ cd my-app - 개발 서버 실행 $ ng serve --open - 접속http://localhost:4200/ 5. ng 명령어 활용- 포트 변경 $ ng serve --port 4202 - 빌드/s..
Angular2의 특징 1. 컴포넌트 기반 개발- AngularJS에서는 컨트롤러가 개발의 중심이었다면 Angular2에서는 컴포넌트가 개발의 중심- Angular2의 컴포넌트는 컨트롤러의 기능을 완전히 대체하며 구조적으로 컨트롤러보다 견고함 2. 타입스크립트를 주력 언어로 채택- 타입스크립트는 마이크로소프트에서 만든 자바스크립트의 상위 집합 언어- 때문에 자바스크립트 문법을 그대로 이용할 수 있고 최신 ECMA 스크립트 표준인 ES6, ES7의 특징까지도 지원 3. 고성능 프레임워크- Angular2는 모바일 환경을 목표로 만들어진 고성능 프레임워크- Angular2는 AngularJS보다 적은 용량으로 더욱 빠르게 프레임워크를 로딩- Angular2의 성능을 향상시킬 수 있었던 기능 중 하나가 지연 로딩(Lazy Loadi..
[번역] 당신이 2017년에 배워야 하는 언어, 프레임워크, 도구 (2017년 웹 개발 트렌드) http://web-front-end.tistory.com/39
다른 프레임워크와 vue.js 비교 http://www.haruair.com/blog/3605
JavaScript - FILTER filter() 메소드는 제공된 함수로 구현된 테스트를 통과하는 모든 요소가 있는 새로운 배열을 만듭니다. var new_array = arr.filter(callback[, thisArg]) 예) 모든 작은 값 걸러내기 다음 예는 값이 10 이하인 모든 요소가 제거된 걸러진 배열을 만들기 위해 filter()를 사용합니다. function isBigEnough(value) { return value >= 10; } var filtered = [12, 5, 8, 130, 44].filter(isBigEnough); // filtered 는 [12, 130, 44] JSON에서 무효한 항목 거르기 다음 예는 0이 아닌, 숫자 id인 모든 요소의 걸러진 json을 만들기 위해 filter()를 사용합니다. ..