JS에서 string을 number로 바꾸는 방법들

자바스크립트는 변수 타입을 지정하지 않고 사용한다. 하지만 === 연산자 등을 사용할 경우 변수의 타입을 맞춰줘야 하고, 0과 "0"은 서로 falsy, truthy 값이라서 구분 할 필요는 있다. 최근 읽은 기사에서 string을 number로 바꾸는 여러 방법들을 보고 이를 정리해 보았다. 1. Number() const quantity = "12"; console.log(Number(quantity)); // 12 무난하고 자주 사용되는 용법이다. 직관적으로 나타내어지고, 정수와 소수 모두 사용가능하다. 2. parseInt() const quantity = "12.5"; console.log(parseInt(quantity)); // 12 parseInt는 주로 소수의 버림이나 n진법 만들기 용으..

Closure &Scope chain

스코프 체인 자바스크립트는 스코프라는 개념이 있다. 스코프는 유효범위를 뜻하고, 크게는 함수 레벨 스코프와 블록 레벨 스코프가 있다. var로 선언한 변수는 함수 레벨 스코프를 따르는데, var은 옛 것이므로 생략하면 let과 const는 블록 레벨 스코프를 따른다. 이 때 블록은 {}를 뜻한다. 따라서 자바스크립트는 {}안에서만 같은 레벨인 것이다. 하지만 같은 스코프 안의 변수만을 사용할 수는 없다. 이 때 필요한 것이 스코프 체인이다. 스코프 체인은 하위 스코프가 상위 스코프를 참조하는 것을 의미한다. const a = 10; { console.log(a); // 10 } 콘솔이 찍히는 곳은 글로벌 안의 하위 스코프지만, 해당 스코프에 a가 선언되어 있지 않으므로 상위 스코프에서 a를 가져온다. c..

React Router Dom V6 변경점-Switch, Route

 리액트 라우터 돔이 V5에서 V6로 업그레이드 되면서 여러 변경점들이 생겼다. 이번에 새로 진행하는 프로젝트부터 V6를 사용하고 싶어서 큰 변경점들을 기록하려고 한다. 1. → 기존의 Switch가 Routes로 변경되었다. // V5 function App() { return ( ); } // V6 // Switch 대신 Routes를 사용하는 모습 function App() { return ( ); } 2. exact 옵션이 기본값이 되었다. // V5 // V6 // exact를 사용하지 않아도 된다. 따라서 exact를 제외하기 위해서는 주소에 *를 첨가해 주어야한다. // V5 // V6 // exact를 사용하지 않은 대신 users 뒤에 *를 붙여서 users 다음 어떤 경로가 들어와도 ..

This

자바스크립트에는 this라는 키워드가 존재한다. 또한 이 this 키워드가 다른 언어와는 다르게 동작을 해서 잘 알아두어야 한다. node.js와 브라우저의 js는 서로 다른 의미의 this를 가지며, 여기선 브라우저의 this를 알아볼 것이다. 가장 포괄적인 설명은 this는 호출한 객체를 의미한다는 것이다. 1. 전역 객체 브라우저에서 window객체는 브라우저에서 시행되는 가장 큰 객체로 존재한다. 따라서 달리 참고할 대상이 없는 this는 모두 window를 의미한다. // 전역에서 사용되는 this는 전역(global)과 같다. var a = 27; console.log(this.a); // OUTPUT: 27 function sum() { console.log(this.a + this.b + ..

Hoisting

JavaScript는 호이스팅이란 아주 유명한 특징이 있다. 특히 변수 var의 호이스팅은 장점도 있겠으나 여러 문제를 일으켰고, 이를 방지하기 위해 let과 const라는 새로운 변수가 생겼다. 그 후로는 let과 const를 사용하면서 호이스팅의 문제가 줄어들었지만, JS의 특별한 작동 방법을 알기 위해서라도 호이스팅을 알아볼 필요가 있다. 변수의 Hoisting 변수의 호이스팅은 변수의 선언이 발생한 스코프 최상단으로 이동하는 듯한 현상이다. 이는 자바스크립트를 실행하면 제일 먼저 코드 안의 모든 변수를 선언하는 과정을 거치기 때문이다. 변수는 결국 메모리 주소를 의미한다. var a = 10; 의 뜻은 a에 해당하는 메모리 주소에 10이라는 숫자를 넣어놓는다는 의미이다. 메모리 주소는 외우기가 극..

프로그래머스 : 거리두기 확인하기-javascript

https://programmers.co.kr/learn/courses/30/lessons/81302 코딩테스트 연습 - 거리두기 확인하기 [["POOOP", "OXXOX", "OPXPX", "OOXOX", "POXXP"], ["POOPX", "OXPXP", "PXXXO", "OXXXO", "OOOPP"], ["PXOPX", "OXOXP", "OXPOX", "OXXOP", "PXPOX"], ["OOOXX", "XOOOX", "OOOXX", "OXOOX", "OOOOO"], ["PXPXP", "XPXPX", "PXPXP", "XPXPX", "PXPXP"]] [1, 0, 1, 1, 1] programmers.co.kr 문제 설명 더보기 문제 설명 개발자를 희망하는 죠르디가 카카오에 면접을 보러 왔습니다. 코..

LeetCode : 6 - javascript

https://leetcode.com/problems/zigzag-conversion/ 6. Zigzag Conversion The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows like this: (you may want to display this pattern in a fixed font for better legibility) P A H N A P L S I I G Y I R And then read line by line: "PAHNAPLSIIGYIR" Write the code that will take a string and make this conversion given a number of ..

프로그래머스 : 다리를 지나는 트럭-javascript

https://programmers.co.kr/learn/courses/30/lessons/42583 문제 설명 트럭 여러 대가 강을 가로지르는 일차선 다리를 정해진 순으로 건너려 합니다. 모든 트럭이 다리를 건너려면 최소 몇 초가 걸리는지 알아내야 합니다. 다리에는 트럭이 최대 bridge_length대 올라갈 수 있으며, 다리는 weight 이하까지의 무게를 견딜 수 있습니다. 단, 다리에 완전히 오르지 않은 트럭의 무게는 무시합니다. 예를 들어, 트럭 2대가 올라갈 수 있고 무게를 10kg까지 견디는 다리가 있습니다. 무게가 [7, 4, 5, 6]kg인 트럭이 순서대로 최단 시간 안에 다리를 건너려면 다음과 같이 건너야 합니다. 경과 시간 다리를 지난 트럭 다리를 건너는 트럭 대기 트럭 0 [] [..