티스토리

Wunhae's Blog

검색하기

블로그 홈

Wunhae's Blog

burger-and-fries.tistory.com/m

우우우으네 님의 블로그입니다.

구독자: 1

방명록 방문하기

주요 글 목록

[React] 리액트 4가지 개념정리 Reference - 코드 스테이츠 Immersive React 강의 https://medium.com/little-big-programming/react%EC%9D%98-%EA%B8%B0%EB%B3%B8-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8%EB%A5%BC-%EC%95%8C%EC%95%84%EB%B3%B4%EC%9E%90-92c923011818 https://reactjs.org/docs/getting-started.html React의 기본, 컴포넌트를 알아보자 모두 알지만 잘 알지는 못하는 컴포넌트 medium.com Getting Started – React A JavaScript library for building user interfaces reactjs.org .. 공감수 0 댓글수 0 2020. 8. 30.
[JavaScript] Prototype Chain - ES5와 ES6로 상속 구현하기 Reference - 코드 스테이츠 이머시브 코스 - Inheritance Patterns 강의 - 위키피디아 - 프로토타입 - MDN - 상속과 프로토타입 - http://insanehong.kr/post/javascript-prototype/ - https://medium.com/@chamikakasun/javascript-prototype-and-prototype-chain-explained-fdc2ec17dd04 Javascript 기초 - Object prototype 이해하기 | Insanehong's Incorrect Note 소개 이번 글에서 다룰 내용은 자바스크립트의 프로토타입 상속(prototypal inheritance) 이라는 확장과 객체의 재사용을 가능하게 해주며 class 기반으.. 공감수 0 댓글수 2 2020. 8. 6.
[JavaScript] Data Structure - Linked List, Hash Table Reference - 코드 스테이츠 이머시브 코스 - Data Structure 강의, Wikipedia 연결 리스트 (Linked List) Linked List는 각 노드가 데이터와 포인터를 가지고 한 줄로 연결되는 방식으로 데이터를 저장하는 자료구조이다. 실생활에 쓰이는 연결 리스트의 예 유튜브의 플레이리스트 포토샵의 Undo, Redo 웹의 되돌아가기 버튼 연결 리스트(Linked List)의 세 가지 종류 단일 연결 리스트 (Singly Linked List) 각 노드에 자료 공간과 한 개의 포인터 공간이 있고, 각 노드의 포인터는 다음 노드를 가리킨다. 이중 연결리스트 (Doubly Linked List) 단일 연결 리스트와 비슷하지만 각 노드에 두 개의 포인터가 존재하고 각각의 포인터는 해당.. 공감수 0 댓글수 0 2020. 8. 3.
[JavaScript] 객체지향 프로그래밍 - ES6 class 키워드없이 구현하기 Reference - 코드 스테이츠 이머시브 코스 - OOP 강의 객체지향 프로그래밍(Object Oriented Programming)이란? OOP는 특정한 언어나 라이브러리가 아닌 프로그래밍 패러다임이다. OOP에선 프로그램을 명령어의 목록으로 보는 시각에서 벗어나 여러 개의 독립된 단위인 '객체'들의 모임으로 파악한다. OOP는 예전에 만들어진 절차적 프로그래밍 언어(C, Pascal, etc)들과 다른 종류의 언어들에서 사용한다. OOP의 모든 것은 지속 가능한 '객체'로 그룹화되며 4가지 주요개념을 통해 재사용성을 가질 수 있다. OOP의 4가지 주요개념 1. Encapsulation 데이터와 함수를 하나의 단위로 캡슐화한다. 캡슐 안의 특정 속성과 메소드를 숨긴 채로 동작하게 할 수 있다 느슨.. 공감수 0 댓글수 2 2020. 7. 29.
[JavaScript] Data Structure - Stack, Queue Reference - 코드 스테이츠 이머시브 코스 - Data Structure 강의 자료구조 (Data Structure) 란? 데이터 자료구조는 컴퓨터 저장공간의 효율성과 실행의 신속성을 높이기 위해 일정한 규칙에 따라 데이터를 구조화한 것이다. 배우면 좋은 이유? 자료구조를 짜는 법을 이해하게 되면 앞으로 더욱 실용적인 코드를 짤 수 있게 된다. 각각의 자료구조는 저마다 탄생된 배경이 있고 각각의 장단점이 모두 다르다. 완벽한 자료구조란 존재하지 않는다. 그래서 자료구조를 배운다면 내가 무언가를 구현할 때 필요한 자료구조가 무엇인지 파악할 수 있게 된다. 또한 면접에서도 자주 나오는 단골 주제이니 배워두면 좋다. 자료구조에 대해 찾아보던 중 아래 영상을 보게 되었는데, 유튜버가 자료구조가 많은 곳에.. 공감수 0 댓글수 0 2020. 7. 28.
[JavaScript] this, call, apply, bind Reference - 자바스크립트 심화개념 in 코드스테이츠 프리코스 this는 실행 컨텍스트 (Execution Context)에 속한다. 어떤 함수가 호출되면, 실행 컨텍스트가 생성되고 call stack에 메모리를 push하고 함수를 벗어나면 call stack에서 pop한다. 실행 컨텍스트는 Scope 별로 생성되고 그 안에는 Scope 내 변수 및 함수 (Local, Global), 전달 인자 (arguments), 호출된 근원 (caller) 그리고 this가 있다. 'this' keyword this는 모든 함수 scope 내에서 자동으로 설정되는 특수한 식별자로 위에서 말한 실행 컨텍스트의 구성 요소 중 하나이다. this는 함수가 실행되는 동안 이용할 수 있다. 5 Patterns of .. 공감수 0 댓글수 0 2020. 7. 22.
[JavaScript] 클로저(Closure) 클로저(Closure)란? 클로저는 외부 함수의 변수에 접근할 수 있는 내부 함수 또는, 이러한 작동 원리를 일컫는 용어이다. 클로저 함수 안에서는 지역 변수(Local Variable), 외부 함수의 변수(Outer Function Variable), 전역 변수(Global Variable)의 접근이 전부 가능하다. 그렇기 때문에 클로저는 일반적으로 사이드 이펙트를 제어할 때와 private 변수를 생성할 때 많이 사용된다고 한다. function outerFn() { let outerVar = 'outer'; console.log(outerVar); function innerFn() { // -> 클로저 함수 let innerVar = 'inner'; console.log(innerVar); } re.. 공감수 0 댓글수 0 2020. 7. 21.
[JavaScript] 스코프 - 함수/변수를 선언할 때 주의해야 되는 4가지 코드스테이츠 프리코스에서 자바스크립트 핵심 개념 - 스코프 강의에서 나온 내용들을 다시 정리해보았다. 강의를 통해 var를 이용한 선언과 전역 범위에서 이루어지는 선언이 왜 위험한지 이해하고 넘어갈 수 있었다. 스코프(Scope)란? 변수는 어떠한 환경 내에서만 사용 가능하며, 프로그래밍 언어는 각각의 변수 접근 규칙을 갖고 있는데 변수와 그 값이, 어디서부터 어디까지 유효한지를 판단하는 범위가 바로 스코프이다. 다시 말해, 변수 접근 규칙에 따른 유효 범위를 스코프라 칭한다. JavaScript에서는 기본적으로 함수가 선언되는(lexical) 동시에 자신만의 Scope를 가진다. Rule 1: Local Scope vs. Global Scope 함수 안에 함수를 넣을 수 있으므로 스코프는 중첩이 가능하.. 공감수 0 댓글수 0 2020. 7. 20.
[JavaScript] Array Method 정리 지금껏 배웠던 여러 가지 배열 메소드들의 종류들에 대해 정리하고 넘어가려 한다. 이 외에도 수많은 메소드가 있으나 일단은 이 정도만 정리하고 차차 더 늘려갈 예정! 배열에 element 넣고 빼기 (pop, push, shift, unshift) pop은 배열의 마지막 요소를 제거함. let arr = [1,2,3,4] arr.pop(); console.log(arr) // [1,2,3] push는 배열의 마지막에 요소를 추가함. let arr = [1,2,3,4] arr.push(5); console.log(arr) // [1,2,3,4,5] shift는 배열의 맨 앞 요소를 제거함. let arr = [1,2,3,4] arr.shift(); console.log(arr) // [2,3,4] unshi.. 공감수 0 댓글수 0 2020. 7. 18.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.