본문 바로가기

개발(Development)/JS(자바스크립트)80

[JS] 자바스크립트 형변환 #2: string to number 등 # 자바스크립트 타입 변환(X to number) 문자열이나 불리언을 숫자로 형변환하는 방법은 4가지 정도다. 1) parseInt(정수 문자열) || parseFloat(실수 문자열) 2) Number(문자열 or 불리언) 3) + (문자열 or 불리언) 4) (문자열 or 불리언) * 1 # 문자열를 숫자로 변환(string to number) : "111" 처럼 숫자로 된 문자열만 변환 가능하다. 숫자가 아닌 경우, NaN 반환 1. parseInt(정수 문자열) || parseFloat(실수 문자열) : 소수가 없는 정수는 parseInt(), 소수가 있는 실수는 parseFloat()로 형변환. parseInt("11") // 11 parseFloat("11.55") // 11.55 parseI.. 2020. 10. 10.
[JS] 자바스크립트 형변환 #1: number to string 등 # 자바스크립트 타입 변환(X to string) 숫자나 불리언을 문자열로 형변환하는 방법은 3가지 정도다. 1) (숫자 or 불리언).toString() 2) String(숫자 or 불리언) 3) "" + (숫자 or 불리언) # 숫자를 문자열로 변환(number to string) 1. (숫자).toString() : Object.prototype.toString 메서드를 활용하는 방법 (111).toString() // "111" (NaN).toString() // "NaN" (Infinity).toString() // "Infinity" 2. String(숫자) : String 생성자 함수를 new 없이 활용하는 방법 String(111) // "111" String(NaN) // "NaN" St.. 2020. 10. 10.
[JS] 자바스크립트 템플릿 리터럴: 백틱(``), 달러(${ }) 사용법 # 템플릿 리터럴(Template Literal) ES6부터 새로 도입된 문자열 표기법이다. 문자열 생성시 따옴표 대신, 백틱(`)을 사용한다. var str_01 = `hello world`; # 템플릿 리터럴의 기능 1. 줄바꿈(개행: Multi-line strings) ▶︎ 백틱(`)으로 템플릿 리터럴을 사용하면, 줄바꿈 등을 쉽게 표현할 수 있다. var str_01 = ` Hi! It's me! JavaScript! So Cool!`; ▶︎ 기존 따옴표 방식에서는 줄바꿈이 허용되지 않았기 때문에, ▶︎ 백슬러시(\)로 시작하는 이스케이프 시퀀스를 사용해야 했다. var str_01 = "Hi! \n\t It's me! \n\t\t\t JavaScript! \n So Cool!"; * \n은 개행.. 2020. 10. 10.
[JS] 자바스크립트 래퍼 객체 (기본/원시타입 표준메서드) # 기본타입의 메서드 호출 (Methods of Primitives) 자바스크립트의 기본타입(원시타입)은 객체가 아니다. 하지만, undefined와 null을 제외한 숫자, 문자열, 불리언, 심벌은 객체처럼 메서드 호출이 가능하다. ('기본타입의 표준 메서드'라고 하기도 한다.) 즉, 아래와 같은 코드가 동작한다. 'hello world'.toUpperCase() // HELLO WORLD 아래는 VS Code 같은 에디터에서, 숫자, 문자열, 불리언, 심벌 타입 변수에 도트(.)를 찍었을 때의 자동완성 목록이다. 객체가 아님에도 (method) 목록이 뜨는 걸 확인할 수 있다. 그리고, 각 메서드 옆에 아래와 같은 도움말이 뜬다. (method) Number.toExponential... (metho.. 2020. 10. 10.
[JS] 자바스크립트 null은 객체? 기본 타입! (typeof null) # 자바스크립트 null? 자바스크립트의 null은 '의도적으로 값이 없음'을 명시하기 위한 기본 데이터 타입이다. 타입도 null이며, 값도 null인 Primitive Type이다. 즉, null은 객체가 아니다!(기본 타입이다!) # typeof null? 하지만 typeof 연산자로 null의 타입을 체크해보면, object가 뜬다. var null_01 = null; typeof null_01; // object 객체인건가 헷갈릴 수 있지만, 이건 자바스크립트 초기 버전의 버그다. # typeof 연산자의 버그 typeof 구현 코드의 원리는 대충 아래와 같다. if(is_undefined?){ // undefined 체크 return undefined; }else if(is_object?){ .. 2020. 10. 10.
[JS] 자바스크립트 데이터 타입: 기본 타입(원시 타입) # 자바스크립트의 데이터 타입 1. 기본 타입(원시 타입: Primitive Type) 1) 숫자(number) 2) 문자열(string) 3) 불린값(boolean) 4) undefined 5) null 6) 심벌(symbol) 2. 참조 타입(객체 타입: Object/Reference Type) 1) 객체 2) 배열 3) 함수 4) 정규 표현식 * 배열, 함수, 정규표현식도 모두 객체다. # 기본 타입(원시 타입: Primitive Type) 1) 숫자(number): 64비트 부동소수점 형식으로, 모든 숫자를 실수로 처리한다. var num_01 = 10; // 정수도 실수로 처리한다. var num_02 = -10.05; // 실수 var num_03 = 10/0; // +Infinity var .. 2020. 10. 9.
[JS] 자바스크립트 변수 생성 과정, 호이스팅 정리 # 자바스크립트의 변수 numOne = 1 처럼 값을 저장해둔 저장소. 필요할 때마다 numOne라는 이름으로 사용할 수 있다. 정확히는 38이라는 값이 저장된 메모리 주소(0x0773F542 등)를 저장하고 있다. var numOne = 1; console.log(numOne); // 1 # 변수의 생성 : var, let, const 키워드로 변수를 만든다 1) var : ES5 이전에 사용하던 변수 생성 키워드. 스코프 관련 이슈가 있음 var numTwo = 2; console.log(numTwo); // 2 2) let: ES6 부터 나온 변수 생성 키워. 다른 언어랑 비슷하다. let numThree = 3; console.log(numThree); // 3 3) const: ES6 부터 나온.. 2020. 10. 8.
[JS] VS Code로 HTML, JavaScript 개발 환경 구축/실행(@맥, 윈도우) # Visual Studio Code 에디터로 HTML, JavaScript 개발 환경 구축/실행하는 방법 1. VS Code 설치 2. 폴더지정, 파일 생성 3. JS파일 실행(Code Runner) 4. HTML 실행(Open In Browser, Live Server) 1. VS Code 설치 ▶ Visual Studio Code 사이트 가서 OS에 맞게 다운 받는다. code.visualstudio.com Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.. 2020. 10. 3.