한 걸음씩 기록하며

💪🏻 목표 1) Node를 이용해서 웹 프레임워크를 구성 2) mongoDB와 mongoose를 이용하여 원하는 데이터베이스를 만들고 활용 3) express를 기반으로 CRUD(Create, Read, Update, Delete) 기능이 포함된 REST api 작성 4) AWS에 express와 mongoDB 서비스를 배포 🙌🏻 아쉬운 점 node로 작업한 첫 프로젝트고 아직은 미숙해서 코드가 너무 난잡한 느낌이다. 그리고 에러 코드 출력에 대해서 아직 완벽하게 구현을 못했다. (구현하다가 다른 에러가 발생해서 애쓰다가 우선 마무리했다.) 다음 프로젝트에서는 CRUD를 좀 더 깔끔하게 구현하는 방법. 쓸떼 없는 코드로 낭비하지 않도록 노력해야겠다. 더불어 로그인 관련은 아직 배우지 않았는데 그것에 대..

ECMA는 지금까지 총 10개의 판이 출판되었다. 그리고 계속해서 발전하고 개선되고 있기 때문에, 자바스크립트는 최신 문법을 잘 습득해놓는 것이 중요하다고 할 수 있다. 그러나 최신 문법만 습득하는 것으로 끝나면 안된다. 과거 버전들의 문법들을 확인하고 무엇이 바뀌었는가를 알고 있는가도 중요하다. 이는 자바스크립트에 대한 깊은 이해에 도움이 되며, 더불어 레거시 코드(누군가 작성한 기존 코드)의 동작을 해석하여 유지보수하고, 더 나아가 최신문법으로 리팩토링 할 수 있는 실력이 된다. *본 글에서는 가장 많은 변화가 있었던 ES6와 ES5의 문법적 차이를 간략하게 정리할까한다. [ES6, ES2015] ES6가 가장 최근 버전이 아님에도 불구하고, 많은 사람들에게 ES6는 여전히 회자된다. 아마도 ES6..

1. Netscape의 JavaScript 1995년 넷스케이프(Netscape)는 동적인 웹 페이지를 만들기 위해서 브라우저에서 동작하는 가벼운 프로그래밍 언어를 만들기로 했다. 이에 넷스케이프의 브랜든 아이크(Brendan Eich)가 스크립트 언어를 만들기 시작해, 고작 10일만에 개발되었다. 해당 언어는 이듬해 3월, 넷스케이프 네비게이터 2에 등장했고, 당시에는 이 언어의 첫 버전을 Mocah라고 불렀다. 이 언어는 후에 LiveScript로 바뀌었다가, 마침내 같은해 12월 현재의 JavaScript가 되었다. (JavaScript라는 이름은, 당시 Java의 유명세를 이용해 마케팅 차원에서 의도적으로 지은 것이다.) 2. ECMA의 자바스크립트 표준화 작업 JavaScript가 인기를 끌자,..

find, findIndex, indexOf는? 자바스크립트 Array.prototype 배열에서 원하는 값 또는 식별자를 찾아내는 메서드 배열을 순차 반복 find 는 인자로 받은 판별 함수를 만족하는 첫 번째 요소를 반환 findIndex 는 인자로 받은 판별 함수를 만족하는 첫 번째 식별자를 반환 indexOf 는 인자로 요소를 받아 만족하는 첫 번째 식별자를 반환 .find() : 판별 함수를 만족하는 첫 요소를 반환 arr.find(callback(element, index, array), thisArg) arr : 순회하고자하는 배열 element : 현재 배열의 요소 index(생략 가능) : 현재 배열의 요소의 index array(생략 가능) : find 메서드를 호출할 배열 thisAr..

🔖 자바스크립트 반복문 종류 1. for : 고전적인 for문 2. for in : 객체의 프로퍼티 키 열거 전용 3. for of : 이터러블 순회 전용 4. forEach(): 배열 순회 전용 메서드 5. while : 고전적인 while문 6. do while : 고전적인 do...while문 7. Object 객체 메서드: 객체 순회 전용 8. Array.prototye 메서드 : 배열 전용 👉🏻 자바스크립트 반복문 총정리 1) for 문: 고전적인 for문 => for(let i = 0; i < 10; i++){...반복 수행 코드...} for (let i = 0; i < 10; i++){ console.log(i); // 0~9까지 출력 } * (주의) 변수 선언 시, const를 쓰면 값 ..

.map( ) arr.map(callback(currentValue[, index[, array]])[, thisArg]) 배열.map((요소, 인덱스, 배열) => { return 요소 }); callback : 새로운 배열 요소를 생성하는 함수 콜백 함수는 다음 세 가지 인수를 가진다. .currentValue : 처리할 현재 요소 .index (Optional) : 처리할 현재 요소의 인덱스 .array (Optional) : map()을 호출한 배열 .thisArg (Optional) : callback을 실행할 때 this로 사용되는 값. 주어진 배열의 값을 재정의할 때 사용하는 방법으로, ECMA에는 "주어진 배열의 값들을 오름차순으로 접근해 콜백함수를 통해 새로운 값을 정의하고 신규 배열을 ..

1. Arrow Function 화살표 함수는 ES6부터 추가된 문법으로, 일반적인 익명 함수(annonymous) 표현식을 사용하여 함수를 만든 것보다 간단하게 함수를 표현할 수 있는 방법이다. 화살표 함수는 항상 익명이다. 기존의 함수 표현식에서 function 키워드를 삭제하고 인자를 받는 매개변수의 괄호()와 코드블록({}) 사이에 화살표(=>) 만 넣어준다. 그리고 함수 내부의 내용이 반환값(return)만 있다면 코드블록(함수의 몸통)인 중괄호({})와 return 생략 가능 또 하나 생략할 수 있는 것이 인자가 하나만 받는다면 매개변수의 괄호()도 생략 가능하고, 여기서 주의해야 할 점은 인자가 없으면 생략할 수 없습니다. // annonymous function let name = func..

*Async & Await promise를 통해서 비동기적으로 처리하게되면 코드가 복잡해질 수 있는데, Async와 Await를 활용하면 promise를 간결하고 간편하고 동기적으로 실행하는 것처럼 보이게 한다 (syntactic sugar) 그렇다고 promise가 나쁘고 꼭 대체해야 되는 것은 아니다. promise를 유지해야 맞는 경우가 있고 async& await으로 바꿔줘야 하는 경우가 있다. 1. Async 동기 처리의 한계 function fetchUser(){ // do network request in 10 secs... return 'haksae'; } const user = fetchUser(); console.log(user); 이런 코드는 10초 정도 유저가 텅 빈 브라우저를 보기..