드리프트의 세상 사는 이야기

데이터 저장, 검색 또는 전송과 관련하여 사용할 수 있는 파일 형식과 데이터 구조가 많이 있습니다. 처리하는 다양한 종류의 데이터를 처리하기 위해 텍스트 파일, Word 문서, Excel 스프레드 시트, zip 파일 등을 사용했을 것입니다. 웹 세계에는 다른 모든 것보다 우위를 차지하는 하나의 형식이 있습니다. 이 형식은 JSON (JavaScript Object Notation의 약자)으로 알려져 있습니다. 이번 편에서는 JSON 객체를 만드는 모든 방법에 대해 알아볼 것입니다. 우리는 그 안에 무엇이 들어가는지, 그리고 값을 읽는 방법에 대해 자세히 살펴볼 예정입니다. JSON 이란? JavaScript에서는 "객체 리터럴 문법"을 사용하여 객체를 정의하는 방법이 있습니다. let funnyGuy =..

누군가는 세계의 미스터리 중 하나가 바로 자바스크립트에서 null과 undefined를 이해하는 것이라고 했습니다. 지금까지의 예제에서 보듯이 null과 undefined는 코드 여러 곳에 나타났었고 아마 우리는 실행도 해봤을 겁니다. null 및 undefined를 이해하는 것은 기괴하지 않고 다만 지루할 뿐입니다. 그래도 조금만 참고 이해 볼까요? Null null부터 알아 보겠습니다. null 키워드는 JavaScript 세계에서 특별한 역할을 합니다. null은 "값이 없다"는 명시적인 정의입니다. 다른 사람들이 작성한 코드를 살펴본 적이 있다면 null이 꽤 많이 나타나는 것을 볼 수 있습니다. null의 장점은 확실성에 있기 때문에 꽤 유용합니다. 변수에 오래된 값이나 정의되지 않은 값을 저장..

부울린 타입은 공부하기 좀 지루합니다. 이유는 다음과 같습니다. 아래 코드는 true 또는 false를 사용하여 변수를 초기화할 때마다 부울린 타입을 생성합니다. let sunny = false; let traffic = true; 축하합니다. 위 코드를 이해한 것으로도 부울린 타입을 80% 정도 이해한 것입니다. 물론 80%는 충분치 않을 수도 있습니다. 여기에서 조금 더 확장 할 것은 나머지 20%에 해당되는 Boolean Object와 Boolean 함수, 그리고 아주 중요한 비교 연산자 ===, !== 에 대해 알아볼 예정입니다. Boolean 객체 부울린 타입은 보통 프리미티브로 사용됩니다. 부울린 프리미티브가 어떻게 생겼는지 조금 전 위에서 본 코드를 다시 보겠습니다. let sunny = f..

안녕하세요? 티스토리로 코딩 블로그를 운영하면서 코드 블록에 넣은 코드가 좀 더 멋지게 보이는 방법이 없을까 고민을 많이 하는데요. 티스토리 플러그인에 하이라이트(Highlight.js)가 있습니다. 그런데, 플러그인에 있는 하이라이트는 코드 스타일이 몇가지 없어 본인이 원하는 스타일의 테마를 적용하기가 어렵습니다. 그래서 직접 HTML 파일을 열어 편집해서 적용하도록 하겠습니다. 일단 Hightlight.js 코드 홈페이지에서 다운 받을게 있는데 먼저 다운로드하도록 합시다. https://highlightjs.org/download/ Getting highlight.js Hosted A prebuilt version of highlight.js with 39 commonly used languages ..

안녕하세요? 티스토리 블로그 사용자입니다. 티스토리 블로그는 네이버 블로그보다 좀 더 사용자 친화적이며, 잘 설계된 정적 사이트 제너레이터라고 볼 수 있습니다. 정적 사이트 제너레이터 즉, Static Site Generator의 종류는 많습니다. Node 쪽에는 GhostJS가 유명하고, Golang 쪽에서는 Hugo 가 유명하고, C++ 및 기타 언어로도 많은 종류가 있습니다. 본인은 GhostJS 를 라즈베리파이에 한번 설치해서 블로그 운영 기초를 한번 배웠었는데요. 아래 링크를 참조하시면 정적 사이트 제너레이터가 어떻게 작동하는지 이해하실 수 있을 겁니다. https://cpro95.tistory.com/2 라즈베리파이에 고스트 블로그 설치하기 라즈베리파이에 고스트(GhostJS) 블로그 설치하기..

객체에 관해서는 지금까지 많은 부분을 다루었습니다. 객체를 만드는 방법을 알아 보았고, 프로토타입 상속에 대해 배웠고, 객체를 확장하는 마법도 보았습니다. 이 모든 과정에서 우리는 매우 낮은 수준에서 수박 겉핥기만 했습니다. 좀더 깊게 이해하는게 필요할 때입니다. 그래서 이 모든 것을 단순화하고 쉽게 이해할 수 있게 ES6 버전의 JavaScript에서는 클래스라는 것을 지원합니다. 다른 객체 지향 프로그래밍 언어에 대한 배경 지식이 있는 분들은 아마도 그 용어에 익숙 할 겁니다. 자바스크립트 세계에서 클래스는 특별한 것이 아닙니다. 객체로 작업 할 때 입력해야 하는 내용을 단순화하는 몇 가지 새로운 키워드와 규칙에 지나지 않습니다. 다음 섹션에서는 이것이 의미하는 바를 좀더 살펴 볼 겁니다. 클래스 문..

우리가 지금까지 알고 있듯이 JavaScript는 빌트인 객체가 잘 제공되는 언어입니다. 이러한 빌트인 객체는 텍스트, 숫자, 데이터, 날짜 등으로 작업할 때 많은 핵심 기능을 제공해 줍니다. 자바 스크립트에 익숙해지면 점점 더 빌트인 객체에 대해 더 완벽하게 이해하고 싶어할 겁니다. 배열을 셔플(shuffle)할 수 있는 다음 코드를 예로 들어 알아 보겠습니다. function shuffle(input) { for (let i = input.length - 1; i >= 0; i--) { let randomIndex = Math.floor(Math.random() * (i + 1)); let itemAtIndex = input[randomIndex]; input[randomIndex] = input[i..

이전 튜토리얼에서 우리는 JavaScript의 객체가 무엇인지, 어떻게 작동되는지에 대한 매우 높은 수준의 개요를 보았습니다. 이 튜토리얼에서는 이전 튜토리얼을 거대한 빙산의 일각처럼 보이게 할 것입니다. 여기서 할 일은 객체를 더 자세히 살펴보고 객체 사용, 자체 사용자 정의 객체 생성, 상속, 프로토타입 및 this 키워드와 같은 고급 주제를 다루는 것입니다. 객체 만나보기 null 과 undefined를 제외한 거의 모든 항목은 객체(Object)와 직접 관련이 있거나 필요에 따라 하나가 될 수 있습니다. Object는 우리가 속성이라고 부르는 key 와 value 쌍을 지정할 수 있는 기능이 있습니다. 이것은 hashtables, associative arrays, dictionaries 과 같은..

지금까지 사용했던 데이터 속성을 넘어서 접근자 속성과 속성을 읽고 설정하는 방법을 완전히 제어 할 수있는 getters 및 setters의 역할에 대해 알아보십시오. 지금까지 작업 한 속성을 데이터 속성이라고합니다. 다음은 이름을 지정하고 값을 할당하는 속성입니다. let foo = { a: "Hello", b: "Monday" } 값을 다시 읽으려면 값에 직접 액세스하기만 하면 됩니다. console.log(foo.a); 이 속성에 값을 쓰는 것은 우리가 알고 있는 방법이 맞습니다. foo.a = "Manic"; 값을 설정하고 읽는 것 외에는 우리가 할 수있는 일이 별로 없습니다. 이제 속성 읽기 및 속성 쓰기의 기능이 다음과 같으면 어떨까요? 기존 문법을 유지하면서 속성 값을 읽고 쓸수 있기 백그라운..

JavaScript로 코드를 짤 때 우리는 대부분의 시간을 숫자를 다루는 데 소비 할 겁니다. 숫자로 직접 작업하지 않더라도 무언가의 수를 유지하거나 배열로 작업하는 것과 같은 가장 기본적인 작업을 수행할 때 숫자를 간접적으로 만나게 됩니다. 이 튜토리얼에서는 일반적인 작업을 수행하는 데 쓸 수 있는 방법을 살펴봄으로써 JavaScript의 숫자에 대해 알아보겠습니다. 그 과정에서, 숫자 관련하여 좀 더 깊게 들어가기도 할 겁니다. 숫자 사용하기 숫자를 사용하려면 우리가 해야 할 일은 단지 사용하는 것뿐입니다. 다음은 숫자 3으로 초기화된 stooges라는 변수를 선언하는 간단한 예입니다. let stooges = 3; 이게 다입니다. 그냥 사용하면 됩니다. 만약 소수점이 있는 숫자를 사용한다면 그냥 정..