오늘은 자바스크립트를 통한 개발을 진행할 때,'개발자 도구' 창의 console을 좀 더 다양하게 활용하며 디버깅을 진행할 수 있는 방법을 소개하려고 한다. 나는 그동안 개발을 진행하며 디버깅의 99%는 에러 로그 또는 console.log에 의존했었는데,우연히 노마드 코더님의 강의를 보고 console을 활용하는 다양한 방법이 있음을 깨달아서 여러분께 공유해보려고 한다. 📕 1. console.log() 먼저, 가장 많이 사용하는 console.log를 설명하기 위해 위와 같은 코드를 적었다.그러면 화면에는 위와 같은 버튼이 만들어지게 되고,위의 '콘솔 찍기' 버튼을 누르면 1+2= 3이 콘솔 창에 찍히게 된다.위의 창을 보면 총 11번 버튼을 누른 것을 확인할 수 있다. 📕 2. console...
자바스크립트를 사용해 코드를 짜다 보면, null, undefined, undeclared, NaN 를 많이 마주치게 된다. 오늘은 이 넷을 명확하게 구분 지어 이해해보자. 📕 1. undefined 자바스크립트에서 'undefined'는 변수가 선언되었으나, 아직 변수에 값이 할당되지 않았을 때 사용되는 값. 자바스크립트에서 아래 코드와 같이 변수를 선언만 해놓고 어떤 값을 할당하지 않으면 자바스크립트 엔진은 자동으로 변수를 'undefined'로 초기화한다 let age; console.log(age) // undefined 자바스크립트에서 'undefined'로 자동으로 초기화하는 이유는, 자바스크립트 엔진이 변수를 선언할 때 메모리를 할당하는 것과 관련이 있다. 자바스크립트 엔진이 메모리를 할당했..
자바스크립트로 알고리즘을 풀고 나서 다른 사람들의 풀이를 보면, Math를 사용하는 경우가 많은데 Math 안에 어떤 메서드가 있는지 몰라서 정리해보려고 한다. 📕 1. Math 프로퍼티 자바스크립트의 표준 빌트인 객체인 Math는 정적 프로퍼티인 Math.PI를 제공한다. (PI 모두 대문자인 것을 주의하자.) Math.PI; // -> 3.141592653589793 우리가 흔히 아는 원주율 값인 PI값을 반환한다. 📕 2. Math 메서드 1) Math.abs Math.abs는 절대값을 구할 때 사용할 수 있다. Math.abs(-1); // -> 1 Math.abs('-1'); // -> 1 Math.abs(''); // -> 0 Math.abs([]); // -> 0 Math.abs(null);..
요즘 주력 언어를 파이썬에서 자바스크립트로 바꾸려고 입문 알고리즘 문제들을 풀이하고 있는 중이다. 그래서 오늘은 알고리즘 풀이의 가장 기초가 되는 제어문을 오늘 한 번 정리해보려고 한다. 📕 1. 제어문이란? 제어문은 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다. 일반적인 코드는 위에서 아래 방향으로 순차적으로 동작하지만, 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있다. 하지만 코드의 실행 흐름이 인위적으로 변경되면, 위에서 아래로 흐르는 코드에 비해 가독성이 떨어진다는 단점이 존재한다. 좋지 못한 가독성은 프로그램에 오류를 발생시킬 수 있다. 자바스크립트에서는 forEach, map, filter, reduce 같은 고차 함수를 이용한 함수형 프로그래..
오늘은 동기(Synchronous)와 비동기(Asynchronous)에 대해 정리해보려고 한다. 개발 공부를 시작했던 처음부터 계속 듣던 용어라 내가 명확하게 구분할 줄 안다고 생각했었는데, 최근 Next.js로 프로젝트를 진행하던 중 혼돈이 한 번 온 적이 있어서 이 기회에 명확하게 이해하고 넘어가야겠다. 동기라는 단어가 내게 주는 느낌이 '동시성'과 비슷한 느낌이라, 동시에 진행될 것만 같은 느낌이고 비동기는 영어로 Asynchronous인데, 그럼 자바스크립트의 Async/await과 비슷한 느낌이 든다. 근데 자바스크립트의 Async/await은 개발자가 의도한 대로 실행 순서를 정할 때 쓰는 거 아닌가? 해서 머릿속에서 혼란이 왔었다. 이번엔 꼭 몸에 체화시켜야지. 📕 1. 동기(Synchron..
📕1. 자바스크립트 공부를 시작하려는 이유 • 공통 프로젝트 때 리액트를 활용해 프로젝트를 진행했었는데, 자바스크립트 문법을 포함한 전반적인 것들에 대한 이해가 부족하다 보니 효율적인 코드를 설계하지 못했던 점이 아쉬워서. • 지금은 리액트를 사용하지만, 추후 다른 프레임워크가 대세가 된다고 하더라도 자바스크립트 기반일 가능성이 높기 때문에 자바스크립트 기반을 확실히 다져놓으면 다른 프레임워크를 사용하는데 많은 도움이 될 것 같아서. 📕 2. 공부계획 • 다양한 책을 비교해 보다가 '모던 자바스크립트 Deep Drive'라는 책이 좋다길래 일단 빌려서 몇 페이지 읽어본 뒤, 소장할 가치가 충분히 있는 것 같아서 인터넷으로 구매했다. 틈나는 대로 이 책을 반복해서 읽어볼 계획이고, 읽다가 정리해야겠다 싶은..
