- [ Node.js & Javascript & Typescript/d3.js ][001] d3.Adder2022-06-12 19:56:58d3.Adder d3.Adder 는 JavaScript의 + 연산자에 의존하는 대신 IEEE 754 부동 소수점 숫자에 대한 전체 정밀도 가산을 해주는 기능을 한다고 합니다. 예제 아래는 예제 코드입니다. const adder = new d3.Adder(); const value1 = 0.031333333333233333; const value2 = 0.139999999999000001; const value3 = 0.333333333333333331; adder.add(value1); adder.add(value2); adder.add(value3); console.log(`sum `, value1 + value2 + value3); console.log(`adder.valueOf()`, adder.v..
- [ Node.js & Javascript & Typescript ]클로저(Closure)에 대해 알아봅시다.2022-06-11 10:21:02안녕하세요. 루루개발자 입니다. 이번에는 클로저(Closure) 에 대해 알아보려고 합니다. 클로저(Closure) 란? 일반적으로 함수 내에 선언된 지역 변수들은 그 함수가 처리되는 동안에만 존재합니다. 즉, 함수가 종료되면 (리턴되면) 함수 내에 선언되었던 변수는 파괴되고 더 이상 접근 불가능 하다고 생각하는 것이 일반적입니다만, 예외가 존재합니다. function makeFunc() { const name = "홍길동"; function displayName() { alert(name); } return displayName; } const myFunc = makeFunc(); myFunc(); 위 예시에서 name 이란 변수는 "makeFunc" 함수 내에 선언된 지역 변수 입니다. "displa..
- [ Node.js & Javascript & Typescript ]웹에서 url scheme 로 앱 호출시 앱 설치 여부 감지 방법2022-06-09 23:27:20안녕하세요. 루루개발자입니다. 최근 회사에서 진행중인 프로젝트 중에 웹에서 앱을 호출해야 하는 상황이 있었습니다. 웹에서 앱을 호출하기 위해서는 앱의 url scheme 를 다음과 같은 예시처럼 웹에서 호출해주어야 합니다. 앱 호출 앱 호출 앱이 사용자의 휴대폰에 설치되어 있다면 해당하는 앱이 정상적으로 호출되겠지만, 문제는 앱이 설치되어 있지 않을 때의 이벤트를 감지해야 하는데 마땅한 방법이 떠오르지 않았습니다. 그러던 도중 문득 event listener 중 focus 와 blur 를 활용해 비슷한(?) 기능을 구현할 수 있을 것 같았고 다음과 같이 코드를 작성하였습니다. class UrlSchemeCaller { windowState = 'focus'; constructor() { this.init..
- [ Node.js & Javascript & Typescript ]javascript 난독화 이슈 (생성자 인자의 파라미터명)2022-05-11 02:13:15안녕하세요. 루루개발자 입니다. 이번 글에서는 javascript 난독화를 적용하면서 생긴 이슈에 대해 공유드리고자 합니다. 다음과 같은 상황이라고 가정해봅시다. -- test-class.class.js class TestClass { apiUrl; apiCallback; constructor(options) { console.log('TestClass.options', options); this.apiUrl = options.apiUrl; this.apiCallback = options.apiCallback; console.log('this.apiUrl', this.apiUrl); console.log('tthis.apiCallback', this.apiCallback); } } -- test-clas..
- [ Node.js & Javascript & Typescript ]javascript 파일 난독화2022-05-10 02:25:51안녕하세요. 루루개발자 입니다. 이번에는 javascript 파일을 난독화 하는 방법에 대해 알아보겠습니다. 사실 이번에 javascript SDK 하나를 개발하게 되었습니다. 하지만 비즈니스 로직이 너무 적나라하게 드러나 있어서 이를 어떻게 해결할까 하다가 난독화를 이용해 이 문제를 조금이라도 해결 할 수 있지 않을까 싶었습니다. 그렇습니다. javascript 파일을 난독화 하는 이유는 javascript 파일 내용을 남이 보더라도 분석을 어렵게 하기 위함입니다. 먼저 터미널에서 아래 명령어를 입력해 uglify-js 패키지를 전역으로 설치합니다. npm i uglify-js 그 후, 아래와 같이 명령어를 입력해 원본js 파일을 난독화한 js 파일로 새로 생성해줍니다. uglifyjs {원본js파일명..
- [ Node.js & Javascript & Typescript ]TDZ(Temporal Dead Zone)2021-11-16 14:30:13안녕하세요. 이번에는 Javascript 의 TDZ(Temporal Dead Zone) 에 대해 알아보겠습니다. ▣ TDZ 가 뭐야? TDZ 란 Temporal Dead Zone 의 약자로 우리 말로 번역하면 일시적 사각지대라는 의미이며, 스코프 시작 ~ 초기화 시작 사이의 구간을 의미합니다. 다른 말로 변수가 선언되고 변수의 초기화가 이루어지기 전까지의 구간이라고 말할 수 있겠습니다. 그림으로 표현하면 다음과 같이 표현 할 수 있을 것 같습니다. TDZ 에서는 선언 되기 전이거나 초기화 되기 전인 상태의 변수를 사용하는 것을 허용하지 않습니다. 그래서 TDZ 구간 때 선언되지 않거나 초기화 전인 변수를 참조하게 되면 에러가 발생하게 됩니다. ▣ 변수 생성 단계 TDZ 를 이해하기 위해서는 Javascr..
- [ Node.js & Javascript & Typescript ]호이스팅 (hoisting) (1)2021-11-15 17:08:17안녕하세요. 이번에는 Javascript 에서의 호이스팅 이란 개념에 대해 알아보겠습니다. ▣ 호이스팅이 뭐야? Javascript 에서 호이스팅이란 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 말합니다. 다른 말로 변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것으로 말하기도 합니다. ▣ 호이스팅 예시 (var, function) var aa; console.log('aa', aa); console.log('aa', aa); var aa; => aa 가 호이스팅 되어, 선언과 동시에 undefined 로 초기화가 되어, console.log 에서 undefined 가 표시됨 function aa() { console.log('aa 함수 호출됨!'); } ..
- [ Node.js & Javascript & Typescript ]Javascript 동작 원리2021-10-26 15:58:04안녕하세요. 이번엔 Javascript 의 동작 원리에 대해 알아보려고 합니다. Javascript 코드를 해석하고 구동시키기 위해서는 엔진이 필요하고, 이러한 Javascript 의 엔진은 다양한 종류가 있습니다. 그 중에 가장 유명하고 많이 쓰이는 엔진은 바로 오픈소스로 개발 된 Google의 V8 엔진 입니다. Node.js 도 V8 엔진을 사용하여 Javascript 런타임 환경을 구현합니다. Javascript 엔진은 크게 2가지 구성요소로 구성되어 있습니다. 1. Memory Heap (메모리 힙) - 메모리 할당이 일어나는 곳 - 정보(데이터)를 저장하는 공간 - 변수, 함수 저장, 호출 등의 작업이 발생하는 공간 즉, Memory Heap 은 데이터를 저장하는 창고라고 생각하면 됩니다. 2..