분류 전체보기
-
[JS] 화살표 함수 (Arrow Function)간단정리 2020. 7. 10. 09:18
약 2년전, Javascript를 처음 접할 때 Arrow Function이 그냥 함수를 정의할 때. 꼭 써야하는 문법이라고 생각했다. 난 시작 부터 ECMAScript2015(ES6) 가 있었기 때문이다. (왜 2015가 6가 되는진 모르겠다.) JS에 대해서 조금 알게 되고, 실제 제품을 만들 때 '굳이 화살표 함수를 써야하나?' 생각이 들었다. 도대체 이게 왜 나왔고, 무엇이 편리한지 알아보자. [스포] (1) function에 비해 구문이 짧고 (2) this, arguments, super 또는 new.target을 바인딩 하지 않는다. 1. function에 비해 구문이 짧다. // ES5 var foo = function () { console.log("foo") }; // foo // ES..
-
[JS] 암묵적(Implicit), 명시적(Explicit) 형변환간단정리 2020. 7. 9. 09:18
대부분의 언어에서 형변환이 존재한다. 직접 한땀한땀 변경하는 방법과 자동으로 변경하는 방법 정도로 생가하면 좋을 것 같다. 분명 한 것은 한땀한땀 변경하는 것을 모두가 추천할 것이다. 암묵적 타입 변환(Implicit Coercion) * 자바스크립트의 강점이기도 하지만, 가장 피해야할 기능이기도 하다. 자바스크립트는 느슨한 언어이기에 var는 어떤 타입이든 자동적으로 변경 된다. 1 + "Ryuk" // 1Ryuk : string 1 + "2" + 3 // 121 : string 1 + 2 + "3" // 33 : string 2 * "2" // 4 : number 1 + true // 2 : number 1 + false // 1 : number 예제가 더 보고 싶다면 (링크) * 위와 같은 기괴한 ..
-
그의 죽음을 추모하며생각 2020. 7. 8. 22:34
故 진현기(진워렌버핏, 진엘론머스크) 삼가 고인의 명복을 빕니다. 퇴근 길 여느 때와 다름 없이, 페이스북과 유튜브를 보았다. `진워렌버핏이라는 방송인이 극단적인 선택을 했다.`라는 헤드라인이 눈에 띄었다. 최근에 터진 한 유튜브의 조작 방송 그 전에 수도 없이 일어난 사건들.. 사실 난, TV와 공인?에게 큰 관심은 없다. 남자와 여자가 편을 갈라 싸우는 듯 해도, '내 주변은 평화로우니까..'라고 생각 했고, 논리적이지 못하고 일방적인 댓글을 보아도 그저 지나쳤다. 사실 나 또한, 큰 주제에 있어서는 할 말이 많았다. "꼴페미!! 김치녀!!"라고 말하는 사람들에게 "과연 저런 극단적인 행동이 없었어도, 남자들이 지금 처럼 말 한 마디에 주의 했었을까요?"라고 말하고 싶었고, "한남!"이라고 말하는 사..
-
[JS] 원시타입 || 기본 자료형 (Primitive Type)간단정리 2020. 7. 8. 10:11
Javascript에서는 원시 타입(Primitive Type)과 참조 타입(Reference Type) 두 가지 자료형을 제공한다. 자바스크립트는 느슨한 타입 언어 || 동적 언어이다. 이 말은 변수의 타입을 미리 지정할 필요가 없다는 의미이다. 타입은 프로그램이 처리되는 과정에서 자동으로 파악되고, 같은 변수에 여러 타입의 값을 넣을 수 있다는 뜻이다. * 그렇기 때문에 프로그램 규모가 커질 수록, Typescript와 같은 대체제를 사용한다. (타입에 따른 실수를 방지 하기 위한 방법이자 도구이다.) var test; // undefined test = null; // null test = 1206; // Number test = "Ryuk"; // String test = true; // Bool..
-
[JS] 유형 비교 `==`와 엄격한 비교 `===`의 차이점간단정리 2020. 7. 7. 23:23
결론 : == 유형 비교는 값만 비교, === 엄격한 비교는 타입도 비교 (1) 0은 false, 그 외 모든 것은 true이다. // 유형 비교는 값만 비교한다. // 0은 false 이기에 true가 된다. // 엄격한 비교는 타입도 비교한다. // number인 0과 false인 boolean은 타입이 다르다. 0 == false // true 0 === false // false(2) number와 string 또한, (1)과 같은 결과가 출력 된다. 1206 == "1206" // true 1206 === "1206" // false(3) null undefined 비교 null == undefined // true null === undefined // false(4) NaN 이 친구는 역시 ..
-
[JS] undefined / null / NaN 차이점간단정리 2020. 7. 7. 23:04
undefined : 선언은 되었으나 값이 할당 되지 않은 상태 (초기화 안하면 무조건 undefined 상태) var temp; Boolean(undefined) 에서는 false Number(undefined) 에서는 NaN String(undefined) 에서는 "undefined" null : 아무런 값도 나타내지 않는 특수한 값 (초기화 해주어야 null 상태가 존재 할 수 있음) var temp = null; C++ 에서는 포인터형 변수가 아무 것도 가르키지 않을 때 nullptr이 된다. (null은 0이 래핑 되어있다.) null의 타입은 null이다. 하지만, typeof로 출력 되는 값은 object 이다. 이는, 코드가 업데이트 되지 않은채 많은 시간이 흘렀기 때문이라고 한다. (링크..
-
MobX @action @computed 간단 정리간단정리 2020. 7. 3. 18:43
이미, 개념으로는 너무 좋은 글들이 많아 가볍게만 작성 하고, 저번 프로젝트 때 나의 mobx 사용이 왜 잘 못 됬는지. 실수한 방법만 기술하자! 좋은 정리 글 (링크) MobX란? MobX는 상태 관리 라이브러리다. React, React-Native 등에서 사용 되며, 가장 많이 비교 되는 것으로는 Redux가 있다. MobX와 Redux의 가장 큰 차이점은 러닝커브라고 생각한다. MobX는 Observable 데코레이터만 잘 사용하면, 쉽게 상태를 변경할 수 있다. 그에 반하여 Redux는 여러 연관 된 라이브러리를 사용해야하고, 러닝커브가 많이 높다. 처음엔 '어려운 것이 좋은 것'이라는 생각이 있었는데. 아직 MobX에 부족한 점을 느끼지 못하여, Redux를 사용해보고 있지 않았다. 최근에 프..
-
DOM과 Virtual DOMIT 지식 2020. 6. 24. 10:03
1. DOM 이란 Q. 우리가 흔히 알고 있는 HTML 파일이 브라우저에 표현 되려면 어떤 과정이 있어야할까? A. 텍스트 파일로 만들어진 웹 문서를 브라우저에 렌더링 하려면 브라우저가 이해할 수 있는 구조로 메모리에 올려야 한다. .HTML 파일이 브라우저에 표현되는 과정 (1) 브라우저의 렌더링 엔진은 웹 문서를 로드 한다. (흔히 우리가 작업한 HTML 파일을 브라우저에 끌어 올리는 행위를 생각하면 쉬울 것 같다.) (2) 웹 문서를 로드 한 후, 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하여 메모리에 올린다. (3) 그리고 브라우저는 브라우저가 이해할 수 있는 구조를 그려낸다. 브라우저가 이해할 수 있는 구조 브라우저의 렌더링 엔진은 모든 요소(Element)와 속성(Attribute)등을..