JavaScript

시작하게 된 계기 이전에도 웹을 어느정도 개발 해왔기 때문에 jquery와 thymeleaf와 같은 도구를 활용하여 쉽게 개발을 해왔었지만 리액트나 vue와 같은 프론트 기술스택을 활용을 해야될 때에는 만들어진 프로젝트 위에 하드 코딩을 하거나 프론트 개발자를 구해 개발을 했어야 했다. 그래서 내 마음 한켠에서는 항상 불편함이 자리 잡고 있었고. 프론트 개발을 제대로 하지 못한다는 자책감을 가지게 되었다. 그리고 시시각각 변하는 프론트엔드의 시장에서의 나는 점점 프론트엔드 개발자들과의 소통이 더욱 어려워지기 시작했고 요구사항에 맞춰 소프트웨어를 함께 설계하고 개발해 나가는 과정 속에서 지속적인 커뮤니케이션의 어려움을 느끼며 큰 부담으로 다가오게 되었다. 그렇게 그런 생각이 희미해져 갈 때 쯤 회사에서 갑..

자바스크립트에서 이터러블한 함수를 만들 때 사용되는 객체입니다. 좀 더 자세하게 알아보도록 하겠습니다. Generator function 제네레이터 함수는 function 앞에 *을 붙여서 정의하고 Generator로 선언한 함수는 Generator 객체를 반환합니다. function* generator(i) { yield i; yield i+1; } const get = generator(10); console.log(gen.next().value); // output: 10 console.log(gen.next().value); // output: 11 위 코드와 같이 첫 요청을 했을 때에는 값을 넣었을 때는 10을 리턴하지만 next() 후 다시 리턴을 해보니 11을 리턴합니다. 여기서 한번더 ne..

자바스크립트를 사용하면서 반복되는 객체를 어떻게 효율적으로 사용해야 할지 고민을 합니다. 그렇기 때문에 ES6가 들어서면서 생기게된 이터러블과 이터레이터에 관련된 개념을 정리하여 새기기 위하여 정리를 했습니다. 이터러블(iterable)이란? 우리가 사용하는 String, Array도 iterable이고 ES6에서 추가된 Set, Map도 iterale입니다. 이터러블을 충족하기 위해서는 두가지 조건을 충족해야 되는데 아래와 같은 조건을 충족해야합니다. Symbol.iterator의 @@iterator 메소드를 구현해야 합니다. [Symbol.iterator] 메서드는 Iterator 객체를 반환해야 한다. 이터러블을 알아보기 전에 잠시 이터레이터(iterator)에 대해 알아봅시다. iterator 반..

자바스크립트 기반의 프로젝트를 진행하면서 String, number, boolean, undefinded, null 등의 값과는 다른 Symbol이라는 타입도 있다는 것을 알게되었습니다. 심볼은 다른 타입과 달리 독특하게 동작하기 때문에 그와 관련해서 정리를 하기 위한 글입니다. 심볼이란? 문서에서는 아래와 같이 정의를 하고 있습니다. Symbol() 함수는 심볼(symbol) 형식의 값을 반환하는데, 이 심볼은 내장 객체(built-in objects)의 여러 멤버를 가리키는 정적 프로퍼티와 전역 심볼 레지스트리(global symbol registry)를 가리키는 정적 메서드를 가지며, "new Symbol()" 문법을 지원하지 않기 때문에 생성자 어떤 면에서는 불완전한 내장 객체 클래스(built-..

일급 함수 함수를 다른 변수와 동일하게 다루는 언어를 일급 함수를 가졌다고 표현합니다. 함수를 다른 함수의 파라미터로 제공하거나, 함수가 함수를 반환 또는 변수에도 함수를 할당할 수 있습니다. 변수에 함수 할당 const helloWorld = function() { console.log("hello World"); } helloWorld(); //output: hello World 익명 함수를 변수에 할당하여 괄호를 통해 함수를 호출함. 함수를 인자로 전달 function hello() { return "hello, "; } function printHello(message, name){ console.log(message() + name); } printHello(hello, "철수"); //outp..

자바스크립트에 개념에 대해 공부 하던 중 호이스팅이라는 단어가 나와서 호이스팅 메커니즘이 자바스크립트에서 어떻게 동작하고 호이스팅이 무엇인지 알기 위해 정리를 하겠습니다. 호이스팅(hoisting) 이란 호이스팅은 코드가 실행되기 전 변수 및 함수에 대한 선언이 해당 스코프의 맨 위로 이동되는 자바스크립트 매커니즘 입니다. 이것은 함수와 변수가 선언된 위치에 관계없이 해당 스코프가 전역인지 지역인지 여부에 관계없이 해당 범위의 맨 위로 이동이 됩니다. Undifind vs ReferenceError - 선언되지 않은 변수 사용시 console.log(typeof variable); // Output: undefined Javascript에서는 선언 되지 않은 변수를 사용시 undefined 값이 할당되어..