본문 바로가기

javascript7

Java LocalDateTime.toString()은 JavaScript에서 어떻게 호환될까? 폴리글랏으로 프로그래밍하며, 여러 언어로된 도메인끼리 메세지를 보내다보니 파일 포맷에 대한 이슈가 있었다. LocalDateTime.now() 를 외부에 전송하게 되면 "2021-11-02T00:05:03.128" 이런식의 String 으로 발송된다. Javascript 에서 이를 호환된 포맷으로 전송하기 위해서는 moment 를 사용할 경우에는 아래와 같은 포맷으로 작성하면 된다. moment.tz('Asia/Seoul').format('YYYY-MM-DD[T]HH:mm:ss.SSS') 참고자료 https://docs.oracle.com/javase/8/docs/api/java/time/format/DateTimeFormatter.html#patterns DateTimeFormatter (Java Pl.. 2021. 11. 2.
[Vue] vue-router에서 Hash Mode Vs History Mode 차이점은 무엇인가? 들어가기 최근 Vue 를 사용하게 되면서 Hash Mode와 History Mode에 대해서 의문점을 가지게 되었습니다. Vue.js에 router 관련된 설정을 추가하면서 다음과 같은 설정에 직면하게 되었습니다. import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) export default new Router({ mode: 'history', base: process.env.BASE_URL, routes: [ { .... } ] }) 여기서 history와 hash를 String으로 작성하여 설정할 수 있습니다 그렇다면 이 둘의 차이점은 무엇일까? 대체 무슨 차이이지? Hash mode Hash mode는 모든 URL을 HASH(.. 2020. 12. 8.
You don't know JS : 타입과 문법, 스코프와 클로저 - 10. 스코프/클로저 스코프 클로저 깨달음 클로저? 클로저는 자바스크립트의 모든 곳에 존재한다. 그저 인식하고 받아들이면됨. 클로저는 렉시컬 스코프에 의존해 코드를 작성한 결과로 그냥 발생한다. 이용하려고 굳이 의도적으로 클로저를 생성할 필요가 없다. 모든 코드에서 클로저는 생성되고 사용된다. 그러므로 여기서 적절히 클로저의 전반을 파악하면 클로저를 목적에 따라 확인하고, 받아들이고, 이용할 수 있다. 핵심 클로저는 함수가 속한 렉시컬 스코프를 기억하여 함수가 렉시컬 스코프 밖에서 실행될 때에도 이 스코프에 접근할 수 있게 하는 기능을 뜻한다. 크도를 보면서 앞의 정의가 설명한 바를 살펴보자. function foo(){ var a = 2; function bar(){ console.log(a) } bar(); } foo().. 2019. 7. 27.
You don't know JS : 타입과 문법, 스코프와 클로저 - 9. 호이스팅 호이스팅 닭이 먼저냐, 달걀이 먼저냐 코드가 한 주 한 줄 위에서부터 차례대로 해석될 것이라고 생각하기 쉽다. 대체로 옳은 생각이지만, 바로 이런 추정 때문에 프로그램을 잘못 이해 할 수 있다. a = 2; var a; console.log(a); ??? 답은 2가 나온다 왜?? 위에서 아래로 처리되는 방식이 아니었으니 이번 코드에서도 그런 식으로 처리되어 똑같이 2가 출력되리라 생각할지도 모른다. 또는 a가 선언되기 전에 사용되었으니 ReferenceError가 발생한다고 생각할 수도 있다. 불행히도 둘 다 틀렸다. 출력 결과는 undefined이다. 무엇이 먼저일까. 선언문(달걀)일까? 아니면 대입문(닭)일까? 컴파일러는 두 번 공격한다. 자바스크립트 엔진이 코드를 인터프리팅하기 전에 컴파일한다는 사.. 2019. 7. 27.
You don't know JS : 타입과 문법, 스코프와 클로저 - 3. 네이티브 #네이티브 String() Number() Boolean() Array() Object() Function() RegExp() Date() Error() Symbol() 대표적인 자료형 하지만 자바와 달리 String()이 String이 아니고 Object 이다. 내부 [[ Class ]] typeof가 'object'인 값(배열 등)에는 [[class]]라는 내부 프로퍼티가 추가로 붙는다. 이 프로퍼티는 직접 접근할 수 없고 Object.prototype.toString()라는 메서드에 값을 넣어 호출합니다. 래퍼 박싱 var a = "abc"; a.length; // 3 a.toUpperCase(); // "ABC" 객체 래퍼의 함정 var a = new Boolean(false); i.. 2019. 7. 27.
You don't know JS : 타입과 문법, 스코프와 클로저 - 2. 값 2.값 자바스크립트에 내장된 값 타입과 작동방식을 살펴보고 정확하게 사용할 수 있도록 완전히 이해하자. 배열 var a = [1, "2", [3]] a.length; //3 a[0] === 1; //true a[2][0] === 3; //true 주의 구멍난 배열! var a = []; a[0] = 1' // 'a[1]' 슬롯을 건너 띄었다. a[2] = [3]; a[1]; //undefined a.length; //3 배열 인덱스는 숫자인데, 배열 자체도 하나의 객체여서 키/프로퍼티 문자열을 추가할 수 있다. (하지만 배열 length가 증가하지는 않는다)는 점이 다소 까다롭다. var a = [ ]; a[0] = 1; a["foobar"] = 2; a.length; //1 a[".. 2019. 7. 27.
You don't know JS : 타입과 문법, 스코프와 클로저 - 1. 타입 1. 타입 자바스크립트에서 타입이라는 말의 의미는 무엇일까? 내장 타입 null undefined boolean number string object symbol 값 타입은 typeof 연산자로 알 수 있고, 해당 연산자의 리턴값은 언제나 String이다. typeof undefined === "undefuned" // true typeof true === "boolean" // true typeof 42 === "number" // true typeof "42" === "string" // true typeof {life: 42} === "object" // true typeof Symbol() === "Symbol" // true 여기서 예외가 존재하는데 바로 Null type null === "ob.. 2019. 7. 26.