LEO Devlog LEO Devlog

JSON JavaScript Object Notation 서버 통신의 시작점 Key - Value 세트로 이루어진 data object를 전달하기 위해 사람이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷 특히 인터넷에서 자료를 주고 받을 때 그 자료를 표현하는 방법 특징 간결한 데이터 교환 포맷 읽기 쉬운 심플한 텍스트 기반 구조 Key - Value 세트 네트워크끼리의 연결 간의 데이터 직렬화 및 전송에 사용 프로그래밍 언어나 플랫폼에 상관없이 JSON을 사용가능 Stringify(Obj) let json = JSON.stringify(true); console.log(json) //true; json = JSON.stringify(['lion','banana']); console.log(json..

비동기 자바스크립트는 동기적인 친구이다. 코드 작성 순서대로 작동하기 때문 / 호이스팅: var, function 선언들이 제일 위로 올라가는 것 예시: setTimeout() -> 정해진 시간 후에 콜백함수를 부름 setTimeout(function() { // 1초 후에 2를 출력해줘 console.log('2'); }, 1000) 콜백은 무조건 비동기적인 것인가 ? No! Synchronous callback(동기적 실행) function printImmediately(print) { print(); } printImmediately(() => console.log('happy')); // Asynchronous callback 함수의 선언이니 제일 위로 호이스팅 된다! Asynchronous c..

재귀함수 사례 재귀함수 문제_1 function unpackGiftbox(giftBox, wish) { for (let i = 0; i < giftBox.length; i++) { if (giftBox[i] === wish) { return true } else if (Array.isArray(giftBox[i])) { let result = unpackGiftbox(giftBox[i], wish); if (result) return true; } } return false; } 주어진 선물박스와 위시가 일치하는지 확인하는 문제이다. giftBox가 이렇게 주어지고 ['macbook', ['eyephone', [], ['postcard']], 'iphone'];​ wish로 'iphone'을 원한다면 ?..

Tree Traversal 전위 순회 가장 먼저 루트를 방문하고, 루트에서 시작해 왼쪽 노드부터 먼저 둘러본 뒤, 왼쪽 노드 탐색이 끝나면 오른쪽 노드를 탐색한다. 중위 순회 루트를 가운데에 두고 순회한다. 제일 왼쪽 끝에 있는 노드부터 순회하기 시작해 루트를 기준으로 왼쪽에 있는 노드의 순회가 끝나면 루트를 거쳐 오른쪽에 있는 노드로 이동하여 마저 탐색합니다. 후위 순회 루트를 가장 마지막에 순회한다. 제일 왼쪽 끝에 있는 노드부터 순회하기 시작해 루트를 거치지 않고 오른쪽으로 이동해 순회한 뒤, 제일 마지막에 루트를 방문합니다. BFS / DFS 그래프의 탐색은 하나의 정점에서 시작하여 그래프의 모든 정점들을 한 번씩 방문(탐색)하는 것이 목적이다. BFS: Breadth-First Search, 너..

자료구조 기초 자료구조: 여러 데이터의 묶음을 저장하고, 사용하는 방법을 정의한 것. 대표적인 자료구조 네 가지 Stack, Queue, Tree, Graph 자료구조는 어떤 특정 상황에 놓인 문제를 해결하는데 특화되어있다. 많은 자료구조를 알아두면, 어떤 상황이 닥쳤을 때 적합한 자료구조를 바로 적용하여 해결할 수 있다. Stack (스택) 데이터(data)를 순서대로 쌓는 자료구조다. 금은동 메달을 각각 책상에 쌓는다고 생각해보자 첫번째로 금, 다음은 은,동 순서로 쌓고, 우리가 다시 그 메달을 집을 때 어떤 메달부터 잡아야 할까? 동메달부터 잡고, 은메달, 마지막으로 금메달을 잡을 수 있다. 이러한 방식처럼 가장 먼저 쌓은 메달은 가장 나중에 잡을 수 있는 경우가 스택이다. 스택의 특징은 입력과 출..

StringifyJSON JSON: JavaScript Object Notation , 데이터 교환을 위해 만들어진 객체 형태의 포맷 JSON의 탄생 배경 객체를 타입 변환해서 String으로 변환할 경우 객체 내용을 포함하지 않는다. 위의 이유로 객체를 JSON의 형태로 변환하거나, JSON을 객체의 형태로 변환하는 방법을 이용한다. JSON.stringify: Object type을 JSON으로 변환한다. JSON으로 변환된 객체의 타입은 문자열이다. 이 과정을 직렬화 (serialize) 라고 부른다. JSON.parse: JSON을 Object type으로 변환한다. 반대로 JSON.parse로 문자열을 객체의 형태로 만든다. 이 과정은 역직렬화 (deserialize) 라고 부른다. JSON의 ..

정답을 맞추는게 답이 아니라 끝까지 도전하는 자세가 중요 ! 객체 지향 JavaScript 객체 지향 프로그래밍: OOP, Object-oriented programming 데이터와 기능을 한 곳에 묶어서 처리 / 속성과 메소드가 하나의 "객체" 라는 개념이며 클래스(Class)라고 부른다. 객체 지향이 트렌드지만, 객체 지향이 무조건 좋은건 아니다 ! 하나의 프로그래밍 방법론일뿐, 각 방법론의 장단점을 잘 알고, 상황에 맞는 방법론을 선택하는게 Best! ex) 메모리 관리가 중요하다면 ? -> 메모리를 적게 쓰는 절차지향 사람들과의 협업이 필요하면? -> 코드 이해가 쉬운 객체지향 자바스크립트는 객체지향 언어가 아니라 프로토타입 기반 언어이다! 자바스크립트의 클래스는 프로토타입을 이용해 구현하는 것!..

React State & Props Props 컴포넌트의 특성 (property)를 의미한다. 객체 형태로 존재한다. 변하지 않는 외부로부터 전달받은 값 부모 컴포넌트(상위 컴포넌트)로부터 전달받은 값 함부로 변경될 수 없는 읽기 전용(read-only)객체이다. State 애플리케이션의 "상태" 컴포넌트 내에서 변경될 수 있는 값 State Hook, useState useState를 React에서 불러오는 방법 import { useState } from "react"; useState를 호출하면 배열이 반환된다 ! const [state 저장 변수, state 갱신 함수] = useState(상태 초기 값); 반환된 배열의 0번째 요소는 state 저장 변수, 1번째 요소는 state 갱신 함수이..