| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
| 29 | 30 | 31 |
- AWS
- web
- Django
- form
- CSS
- PYTHON
- js
- Baekjoon
- DRF
- c++
- API
- django rest framework
- Git
- 파이썬 알고리즘
- 장고
- java
- MAC
- django widget
- 알고리즘 문제
- 파이썬
- 알고리즘 풀이
- 알고리즘
- 백준
- Algorithm
- es6
- django ORM
- HTML
- 알고리즘 연습
- react
- javascript
- Today
- Total
목록javascript (15)
수학과의 좌충우돌 프로그래밍
Symbol symbol 은 새로운 데이터 타입입니다. 하지만 실제로 많이 사용되지는 않으니 간단히 알아보도록 하겠습니다. symbol 의 첫번째 특징은 unique 입니다. symbol 객체를 만들면 이는 다른 모든 것과는 다른 유일한 것이 됩니다. const s1 = Symbol(); const s2 = Symbol(); console.log(s1 === s2); // false symbol 객체를 만들 때 description 을 넣을 수 있습니다. 하지만 이는 해당 symbol을 설명하기 위할 뿐 값으로서 사용할 수 없습니다. const s1 = Symbol("first"); const s2 = Symbol("second"); console.log(s1); // Symbol(first) conso..
generator generator 는 중간에 멈출 수 있는 함수입니다. 일반적인 함수를 생각해보면 함수를 실행함과 동시에 함수의 처음부터 끝까지 한 번에 실행합니다. 하지만 generator 함수는 일시적으로 정지할 수 있고, 이를 다시 시작할 수 있습니다. 이를 사용하기 위해서는 function 뒤에 * 를 붙여주면 함수 내부에서는 yield 를 사용할 수 있습니다. 함수가 yield 를 만나게 되면 해당 함수는 일시적으로 정지되고 yield 뒤에 인자를 반환합니다. 일반적인 함수의 return 과 비슷한 역할을 하고 있습니다. function* fruits() { yield "apple"; yield "banana"; yield "melon"; yield "strawberry"; } 해당 함수를 찍..
Proxy Proxy 객체는 기본적인 동작(속성 접근, 할당, 순회, 열거, 함수 호출 등)의 새로운 행동을 정의할 때 사용합니다. proxy 는 target 과 handler 두 개의 인자를 받습니다. target 으로는 새로운 행동을 정의하고 싶은 object 를, handler 에서는 target 의 행동을 정의합니다. const user = { name: "minsung", age: 24, school: "UOS" } const userFilter = {}; const filteredUser = new Proxy(user, userFilter); proxy 객체 filteredUser 는 target 의 필드를 참조가능합니다. 이 뿐만 아니라 target 과 동일하게 사용이 가능합니다. conso..
이번 포스팅에서는 async 와 await 에 대해서 알아보도록 하겠습니다. 이를 제대로 이해하기 위해서는 저번 포스팅을 먼저 이해해야 합니다. https://ssungkang.tistory.com/entry/ES6-Promises-then-catch-all-race-finally [ES6] Promises - then, catch, all, race, finally 이번 포스팅에서는 js 의 Promises 에 대해서 알아보도록 하겠습니다. javascript 의 비동기성 사람은 한 번에 두 가지 일을 할 수가 없습니다. 흔히들 말하는 멀티태스킹도 실제로는 한 번에 두 가지 일을 동시에.. ssungkang.tistory.com 왜냐면 이들을 Promise 의 업데이트한 것이기 때문입니다. 업데이트를 ..
간단하게 반복문에 대해서 알아보도록 하겠습니다. 우선 기존의 js 에서 반복문은 다음과 같습니다. const fruits = ["apple", "banana", "melon", "strawberry"] for (let i=0;i console.log(`${index} 번째 원소 :${current}`); fruits.forEach(printFruit); for of for of 는 아래와 같이 사용합니다. for (const fruit of fruits){ console.log(fruit); } 문자열에서도 가능 뿐만 아니라 여러 iterable 한 객체에 대해서 모두 가능합니다. 문자열도 마찬가지죠. for (const letter of "minsung"){ console.log(letter); } /..
Spread Spread 는 변수를 가져와서 풀어헤치고 전개해주는 것을 말합니다. unpacking 이라고 하죠. Spread 를 사용하기 위해서 ... 을 사용합니다. const fruits = ["apple", "banana", "melon", "strawberry"]; console.log(fruits); console.log(...fruits); // [ 'apple', 'banana', 'melon', 'strawberry' ] // apple banana melon strawberry 이는 두 개의 array 를 합칠 때도 유용하게 사용합니다. Spread 를 사용하지 않아도 배열을 합치는 방법은 많겠지만 코드 길이나 가독성 면에서 Spread 가 상당히 우수합니다. const fruits =..
Array Method array method 역시도 ES6 에서 많이 업데이트 되었습니다. 이들에 대해서 알아보도록 하겠습니다. Array.of Array.of() 는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새 Array 인스턴스를 만듭니다. const fruit = Array.of("apple","banana","strawberry"); console.log(fruit); // [ 'apple', 'banana', 'strawberry' ] Array.from Array.from() 은 유사 배열 객체(array-like object)나 반복 가능한 객체(iterable object)를 얕게 복사해새로운 Array 객체를 만듭니다. 글로만 봐서는 어려울 수 있으니 예제를 통해 살펴보도록 합시다..
Template Literal Template Literal 은 문자열과 변수가 합쳐진 것을 말합니다. 이번에는 Template Literal 의 개선된 사항에 대해서 알아보도록 하겠습니다. 다음 예시를 살펴봅시다. const intro = (name="anonymous") => "My name is " + name; console.log(intro("minsung")); // My name is minsung 결과를 출력하기 위해서 문자열과 변수를 합쳐주는 부분이 문자와 변수가 많이질수록 가독성을 해칠 위험이 있습니다. 따라서 `(GRAVE ACCENT) 와 $, {} 를 사용해줍니다. `` 로 묶인 부분은 string 으로 인식되고 ${ } 안은 변수로서 인식합니다. const intro = (nam..
Arrow Functions arrow function 은 기존 자바스크립트에서 함수의 모습을 개선한 것 입니다. 사용 방법을 살펴보도록 합시다. 우선 arrow 는 => 을 의미합니다. 기존의 function 이라는 키워드를 없애고 이를 arrow 로 대체한 것이죠. 우선 arrow function 을 사용하지 않은 기존의 예시부터 살펴보겠습니다. const nameList = ["minsung", "sungbin"] const nameLength = nameList.map(function(name){ return name.length; }) console.log(nameLength); // [7,7] 이를 arrow function으로 개선하면 다음과 같습니다. const nameLength = na..
Let and Const let 과 const 에 대해서 알아보도록 하겠습니다. 이 둘은 변수를 선언할 때 사용하게 되는데 이전에는 var 를 사용하였습니다. var 로 변수를 선언하게 된다면 다음과 같이 변수의 overwrite 가 가능해집니다. var name = "minsung"; name = "sungbin"; 이렇게 var 를 사용하게 되면 큰 어플리케이션을 만들거나 협업을 할 경우 문제가 생길 수 있습니다. 다른 개발자가 다른 파일에서 또는 같은 파일인데 다른 위치에서 작업을 할 경우 name 이라는 변수명을 또 사용할 수 있게 되고 의도치않게 name 은 sungbin 으로 덮어쓰게 됩니다. 따라서 변수가 변하는 걸 막기 위한 매커니즘이 필요했고 const 가 등장하였습니다. const 는 ..