본문 바로가기

JavaScript38

[자바스크립트] JSON to TSV 변환 출력 파싱 방법 (+node.js TSV파일 생성 예제 포함 ) | Javascript: JSON 데이터를 TSV파일로 파싱하는 방법 별도 라이브러리 없이, 자바스크립트만으로 JSON을 TSV로 만드는 법을 정리합니다. (node.js 및 브라우저 환경 모두에서 작동) "아래의 jsonToTSV() 함수에 JSON형식의 배열객체를 넣어 호출하면 됩니다." (JSON파일, TSV파일을 다루는 예제도 샘플코드로 작성해두었습니다.) # JSON to TSV 함수 (JSON to TSV Converter) : JSON형식의 배열객체를 넣어 호출하면, TSV 형식의 문자열(string)을 반환합니다. : JSON형식의 문자열(string)을 넣어 호출할 경우엔, 함수의 1-1 코드 대신, 1-2 코드를 사용하면 됩니다. function jsonToTSV(json_data) {.. 2021. 3. 26.
[자바스크립트] JSON to CSV 변환 출력 파싱 방법 (+JSON파일 읽기, CSV파일 쓰기 예제 코드 in node.js) | Javascript: JSON 데이터를 CSV파일로 파싱하는 방법 별도 라이브러리 없이, 자바스크립트만으로 JSON을 CSV로 만드는 법을 정리합니다. (node.js 및 브라우저 환경 모두에서 작동) "아래의 jsonToCSV() 함수에 JSON형식의 배열객체를 넣어 호출하면 됩니다." (JSON파일, CSV파일을 다루는 예제도 샘플코드로 작성해두었습니다.) # JSON to CSV 함수 (JSON to CSV Converter) : JSON형식의 배열객체를 넣어 호출하면, CSV 형식의 문자열(string)을 반환합니다. : JSON형식의 문자열(string)을 넣어 호출할 경우엔, 함수의 1-1 코드 대신, 1-2 코드를 사용하면 됩니다. function jsonToCSV(json_data) {.. 2021. 3. 24.
[자바스크립트] TSV to JSON 변환 출력 파싱 방법(예제 코드 + node.js 파일 처리 포함) CSV를 JSON로 파싱하는 방법(CSV to JSON)은 아래 링크 참고. [자바스크립트] CSV to JSON 변환 출력 방법+샘플예제코드(node.js 파일 처리 포함) | Javascript: TSV를 JSON으로 변환하는 방법 TSV는 Tab Seperated Values의 약자로, 탭( \t )로 구분된 문자열을 말합니다. 각 열은 탭(\t)로 구분되고, 각 행은 줄바꿈(\r\n)으로 구분되기 때문에, 이를 이용하면 TSV를 JSON으로 파싱할 수 있습니다. 이 글에서는 별도 라이브러리 없이, 자바스크립트만으로 TSV를 JSON으로 만드는 법을 정리합니다. (node 및 브라우저 환경 모두에서 작동) "아래의 tsvToJSON() 함수에 TSV문자열을 넣어호출하면 됩니다." (TSV파일을 다루.. 2021. 3. 24.
[자바스크립트] CSV to JSON 변환 출력 방법+샘플예제코드(node.js 파일 처리 포함) | 자바스크립트로 CSV를 JSON으로 변환하는 방법 CSV는 Comma Seperated Values의 약자로, 콤마( , )로 구분된 문자열을 말합니다. 행의 항목(컬럼)들은 콤마로 구분되며, 각 행은 줄바꿈으로 구분됩니다. 따라서 CSV문자열을 JSON으로 변환하는 방식은 아래와 같습니다. 1) 줄바꿈(\r\n)으로 각 행을 구분해 주고, 2) 콤마( , )로 각 컬럼을 구분해 주고, 3) 머리행에서 제목을 추출, 내용행에서 데이터를 추출하고, 4) 각 행을 객체로 만들어 배열에 담아준다 바로 사용할 수 있는 함수로 만들어 두었으며, 사용 방법도 샘플 예제 코드로 작성해 보았습니다. JQuery나 별도 라이브러리/모듈 없이 오직 자바스크립트만 사용하므로, 브라우저(browser), node.js 등.. 2021. 3. 19.
자바스크립트 코드 실행 동작 원리: 엔진, 가상머신, 인터프리터, AST 기초 웹개발자라면, 적든 많든 자바스크립트를 다루지 않을 수 없습니다. 이번 글에서는 자바스크립트 코드가 내부적으로 어떤 원리로 실행되는지를 정리해 보려고 합니다. 아래 그림은 자바스크립트의 구동원리를 도식화한 것입니다. 이 글을 끝까지 읽으시면, 이 그림이 완벽히 이해되실겁니다. # 자바스크립트 코드의 구동 원리 일반적으로 소스코드는 어떤 원리로 실행될까요? 1. 코드 실행의 기본 원리 - 프로그래밍 언어로 코드를 작성한다. - 인터프리팅, 컴파일 등의 과정을 통해 0, 1로 이루어진 기계어로 변환된다. - 0, 1로 이루어진 기계어 코드가 '메모리'라는 곳에 저장된다. - CPU는 메모리에 있는 0, 1로 이루어진 코드를 읽어 on/off 전기 신호로 실행시킨다. * on/off 전기신호는 이진수 계산으로.. 2021. 3. 12.
[자바스크립트] 점 3개 ... : Rest파라미터, 스프레드 문법, 객체 스프레드 프로퍼티 Rest파라미터, 스프레드 문법는 점(dot) 세개를 연달아 사용하는 문법이다. 비슷하게 생겼지만, 이 둘은 완전히 다른 용도로 사용된다. (참고로 스프레드 프로퍼티는 객체용 스프레드 문법이다) 1. Rest파라미터 => 함수에 매개변수를 여러개 전달할 때 주로 사용!(매개변수 갯수를 모를 때) - 사용 형식: function( ...매개변수 ) { 코드 } - 작동 방식: 함수의 매개변수에 사용하며, 여러개의 인수를 전달 받아 배열로 변환한다. - 예제 코드 function printItems(...items){ // item은 여러개의 인수를 받는다. console.log(items); } printItems('첫째', '둘째', '셋째'); // [ '첫째', '둘째', '셋째' ] 배열 출력 - .. 2021. 3. 11.
[자바스크립트] HTML input 입력창 자동 포커스, 커서 마지막 설정 방법 HTML input에 focus주고, 마지막 글자에 커서 위치 1. input 입력창의 자동 포커스 설정 방법 : input 태그의 속성으로 autofocus를 주면 된다. 결과: 포커스된 커서가 맨 앞으로 간다. 2. input 커서를 텍스트 마지막으로 위치시키는 방법 원리는 동일하다. input 태그에 포커스를 주면서, value값을 새로 넣어주면 된다. 1) 첫번째 방법: input태그에 autofocus 설정된 경우. const $input_01 = document.getElementById('input_01'); // input 태그 취득 $input_01.value = "js로 추가한 value"; // input 태그의 value에 새로운 값 설정 2) 두번째 방법: input태그에 auto.. 2021. 1. 16.
[자바스크립트] 논리연산자(&&, ||) 단축평가 # 단축평가란? ||(논리합), &&(논리곱) 연산자는 왼쪽부터 오른쪽으로 평가를 진행하는데, 중간에 평가 결과가 나오면 오른쪽 끝까지 가지 않고 평가 결과를 반환해 버린다. 이를 '단축 평가(short circuit evaluation)'라고 하며, 피연산자의 타입을 변환하지 않고 그대로 반환한다. 단축평가를 활용하면 아래와 같은 코드가 가능해진다. "apple" || "banana"; // "apple" "apple" && "banana"; // "banana" 하나하나 차근차근 살펴 보자. 1. ||(논리합) 연산자의 단축 평가 || 의 경우, 둘 중 하나만 true면 true로 평가되므로 왼쪽 피연산자가 true이면 바로 true를 반환한다. true || false; // true(오른쪽의 fa.. 2020. 10. 15.
[자바스크립트] 변수 선언 방식 차이: var / let / const 자바스크립트의 변수 선언은 var로만 가능했으나, ES6(ES2015)부터 let과 const가 추가 되었다. 옛날의 var가 최신의 let(변수), const(상수)로 분리되었다고 생각할 수 있으나, 내부 사정은 상당히 다르다. (참고로 여전히 var도 함께 사용이 가능하다) var와 let, const가 어떻게 다른지 상세하게 정리해본다. # var, let, const 차이점 5가지 1. 중복선언 가능 여부 2. 재할당 가능 여부 3. 변수 스코프 유효범위 4. 변수 호이스팅 방식 5. 전역객체 프로퍼티 여부 #1. 중복선언 1. var : 중복 선언이 가능하다. // 첫번째 변수 선언+초기화 var a = 10; console.log(a); // 10 // 두번째 변수 선언+초기화 var a = .. 2020. 10. 14.

티스토리툴바