대가는 결과를 만든다

자바스크립트는 2015년 이래로 매년 6월마다 새로운 ECMAScript 표준이 계속 나오고 있다. 'ES5', 'ES6', 'ECMAScript 2015', 'ES2018', 'ECMA 2017' 등으로 버전을 칭하는데 햇갈린다... 그래서 정리한다. 표기는 다음과 같이 두가지 방법이 있다. ECMAScript/ECMA/ES 연도 - 예)ECMA 2015, ES2015 ES 버전 번호 - 예)ES5, ES6, .... 따라서, 다음과 버전과 주요 차이점을 간단히 적어보자면 다음과 같다. ECMA 2015, ES2015 = ES6 : 클래스, promise 등 ECMA 2016, ES2016 = ES7 : 제곱 연산자, includes ECMA 2017, ES2017 = ES8 : async/await

ES6(ECMA2015) Promise를 좀 더 편하게 사용하기 위한 것으로 ES8(ECMA 2017)에서 발표된 문법이다. async await에 대해 정리해본다. 1. async는 function 앞에 위치 한다. 2. async를 function 앞에 붙이면 해당 함수는 항상 Promise륻 return한다. (항상 resolved promise로 값을 감싸 반환되도록 한다.) async function f() { return 1; } f().then(alert); // 1 // 혹은 명시적으로 promise를 return (위와 동일) async function f() { return Promise.resolve(1); } f().then(alert); // 1 3. await는 async함수 안..

PR을 생성하여 Reviewer에게 전송하는 방법을 정리 한다. Bitbucket, sourcetree 기준이다. 1. Local Repo에 commit 후 Remote Repo Push 전에 Pull 요청 생성 (create Pull Request) 선택 2. Push할 브랜치를 선택 후 웹에서 pull 요청 생성 클릭 3. Pull Request 작성

javascript에서 this가 가르키는 것들에 대해 정리해본다. 기본적으로 this는 window이다. 하지만 이 this가 가리키는 것은 this가 위치하는 곳 마다 바뀌게 된다. * 화살표 함수 사용시 this가 또 달라지니 유의해야 한다. 1) 객체 메서드 안의 this는 객체자신을 가리킨다. var obj = { a: function () { console.log(this);} }; obj.a(); //obj를 출력 2) 하지만 아래처럼 호출하면, a2는 obj.a를 꺼내온 것이기에 더이상 obj 객체의 메서드가 아니므로 this는 window를 가리킨다. * 호출하는 시점에 함수가 객체의 메서드 인지 그냥 함수인지가 중요 var a2 = obj.a; a2(); //window 를 출력 => ..

함수의 메서드! 생소한 문법이었는데 정리해본다. 이전에 javascript this에 대한 이해가 먼저 선행되는게 좋다. 우리가 정의하는 함수에도 사용할 수 있는 기본 메서드가 있다는 것이다. (Array 메서드, Object 메서드 같이...) 함수의 메서드 중 call, apply, bind가 대표적이다. 1. call, apply 함수를 호출하는 일반적인 방법은 '함수명( )'이다. call, apply는 함수를 호출하는 또다른 방법이라고 생각하면 쉽다. let example = function (a,b,c) { return a+b+c; } //== 아래 세개의 함수호출은 모두 똑같은 동작을 한다. ==// example(1,2,3); example.call(null, 1, 2, 3); exampl..

• 웹브라우저에서 제공하는 3차원 그래픽 자바스크립트 API • GPU 가속을 사용한 높은 성능의 그래픽 구현 • 플래시, 실버라이트, 유니티 등의 플러그인이 필요 없음. • OpenGL ES 2.0 기반의 Javascript 바인딩 버전 ( WebGL 2.0은 OpenGL ES 3.0 기반 ) => '웹브라우저에서 Javascript로 컨트롤할 수 있는 OpenGL ES 2.0의 최적화 버전' • OpenGL ES를 기반으로 하기때문에 OpenGL에서 무겁고 불필요한 부분은 제거되었고, HTML Canvas element에 랜더링 결과를 그리도록 되어있음. • WebGL 기반 3D javascript engine 라이브러리들 - three.js, babylon.js, cannon.js, scene.js..

Three.js에서 사용할 수 있는 material의 종류들과 그 특성에 대해 간단히 정리한다. 1. MeshBasicMaterial : 단순 음영(Shader)로 그림 (평면, 와이어프레임) - 조명 영향 X 2. MeshDepthMaterial : 음영으로 깊이를 표현 재질 -카메라의 원근을 이용한 깊이 표현, 뒤에 있을 수록 어두움. 3. MeshLambertMaterial : 반사광, 하이라이트가 없는 재질 -정점 Shader 음영 계산하여 면에 보간, -비물리적 기반의 Lambertian 모델 사용 -Gouraud 쉐이딩 모델, 반짝이는 표면을 시뮬레이션 할 수 X 4. MeshNormalMaterial : 백터를 RGB 색상으로 매핑하는 재질 5. MeshPhongMaterial : 반사 하이..

Raycast는 직역하면, 광선을 쏜다라는 뜻. working out what objects in the 3d space the mouse is over