이번에는 template literals 에 대해 알아보겠다. 기존 문자열 표기법은 이중 따옴표(") 또는 작은 따옴표(')를 이용하였다. 하지만 ES6 부터는 templete literals 라는 새로운 문자열 표기법이 도입되었다. templete literals 는 백틱(`) 이라는 문자를 사용하여 표기한다. // ES5var text = 'string text'; // ES6const text = `string text`; // ES5console.log('string text line 1\n' + 'string text line 2');// "string text line 1// string text line 2" // ES6console.log(`string text line 1string te..
arrow function에 대해서 머리속으로 정리해보고자 합니다. 이번 시간에도 마찬가지로 arrow function(ES6) 이 나오기 전 어떤 현상이 있었고 그 현상을 어떻게 해결 했는지에 대해 이야기 하겠습니다. arrow function이 나오기 전에 우리는 느꼈을 수도 있지만 메소드 안에 함수를 만드는게 매우 어려웠을 것이다. 바로 this 때문이다. 일단 아래의 예제를 보자. function Person() { this.age = 0; console.log(this); // Person { age: 0 } setTimeout(function growUp() { console.log(this); // window this.age++; // NaN }, 1000);} var p = new Per..
우리는 작업을 하다보면 많은 값들을 찾고 그 상황에 맞게 값을 변경 또는 삭제를 한다. ES5에서는 주로 Array.prototype.foreach(), Array.prototype.map(), Array.prototype.filter() 를 사용하여 특정 또는 전체 값에 대한 처리를 했다. 처리를 하는 도중 이 모든 함수는 한 배열 안에 있는 모든 데이터를 확인 한 후 변경 및 삭제를 한다. 하지만 이들의 단점 아닌 단점은 어떤 하나의 특정 값만 바꾸려고 하는데 모든 데이터를 확인 한다는 점이다. 배열이 작을 때는 속도 차이가 크게 없지만 배열의 데이터가 클 때 아무래도 모든 데이터를 확인하면서 처리하다 보니 속도가 낮아지는 현상을 볼 수 있다. 그래서 어떤 하나의 값만 찾아서 값을 변경 할 때 ES6..
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- const
- website
- Prototype
- 클래스 컴포넌트
- array
- window
- Es5
- Angular
- useEffect
- 깃헙
- ES6
- NestJS
- Function Component
- HTML
- string
- 클래스형 컴포넌트
- github
- scope
- 함수 컴포넌트
- JavaScript
- 가상돔
- this
- class component
- 웹사이트
- react
- virtual dom
- Let
- TypeScript
- 리엑트
- useState
- Total
- Today
- Yesterday