포스트 | kimyoungjo

김영조

@kimyoungjo

머신 비전 개발자

2019년 11월 05일 · 7분 분량

[11.5] React 공부

기초 폼 React.DOM.render { <h1>Hello, World!</h1> document.getElementById('root') } render는 react의 정수이다. 위에 코드를 살펴보면 H1태그를 작성하였고 root이라는 ID를 가진 element를 불러왔다. react는 h1태그와 같은 html을 rootID를 가진 element에 render해준다. 따라서 화면엔 Hello World가 출력된다. 그리고 이러한 문법을 JSX라고 한다. JSX const element = <h1>Hello World!</h1> JSX는 위 코드와 같이 변수에도 …

자바스크립트

2019년 11월 01일 · 8분 분량

[11.1]Javascript 공부

IIFE js에서 자주사용되는 코딩패턴 중 하나이다. JS에서의 함수 function foo() { alert("Hello World"); } foo(); IIFE를 적용하지 않은 코드 foo 라는 함수를 1-3째 줄에 선언하고 5번째 줄에서 foo();를 통해 호출해내는 일반 개발자들이라면 자연스럽게 떠올릴 만한함수의 선언과 호출 과정이다. var msg = "Hello World"; var foo = function () { alert(msg); …

자바스크립트

2019년 10월 31일 · 1분 분량

[알고리즘] 하노이의 탑 Javascript로 풀어보기

[알고리즘] 하노이의 탑 Javascript로 풀어보기

하노이의 탑 풀어보았다. 소스코드 function Hanoi(plate, departure, dropBy, destination) { if (plate === 1) { document.getElementById('responseDiv').innerHTML = `${plate}을 ${departure}에서 ${destination}로 이동` } else if (plate > 1) { Hanoi(plate - 1, 'A', 'B', 'C'); document.getElementById('responseDiv').innerHTML = `${plate - 1}을 ${departure}에서 ${destination}로 이동` Hanoi(plate - 1, 'C', 'A', 'B'); } } …

자바스크립트

2019년 10월 29일 · 5분 분량

JavaScript ES201n 공부

글에 앞서 본 글은 ZeroCho님의 ECMAScript 텍스트 강좌를 인용했습니다. ES6 JavaScript의 ES시리즈란 JavaScript의 버전을 말한다. 최신 Javascript는 var부터 모든것들이 바뀌고 편의성이 개선되었다고 한다. const, let var을 대체하는 이 두 가지는 함수의 스코프를 따르는것이 아닌 블록 스코프를 따른다. var은 어느곳에서 선언해도 최상단으로 끌어올려지는 '호이스팅'이라는 개념때문에 개발자가 예기치 못한 상황을 많이 맞이하였지만, …

자바스크립트

2019년 10월 18일 · 2분 분량

[10.18]JavaScript Design pattern(모듈, 싱글톤, 생성자)

모듈 패턴 var newScope = (function () { 구문 }) (); 함수를 선언하자마자 실행시키는 패턴. IIFE라고도 함. 싱글턴 패턴 var singleton = (function() { var instance; var a = 'hello'; function initiate() { return { a: a, b: function() { alert(a); } }; } return { getInstance: function() { if …

자바스크립트

2019년 10월 18일 · 5분 분량

[10.18]JavaScript 정리

실행 컨텍스트 자바스크립트가 왜 그렇게 동작하는지를 알려줌 처음 코드를 생성하는 순간 전역컨텍스트가 생김 함수 컨텍스트는 함수를 호출할 때마다 하나씩 생긴다. 컨택스트 생성 시 컨텍스트 안에 변수객체 scope chain, this 가 생성된다. 컨텍스트 생성 후 함수가 실행되는데 사용되는 변수들은 변수 객체 안에서 값을 찾고 없다면 스코프 체인을 따라 올라가며 찾습니다. 함수 …

자바스크립트

2019년 10월 17일 · 7분 분량

[10.15] javascript 정리

window 객체 : window 객체는 Document의 상위객체이다. 주요 객체 : screen, location, history, document 주요 메소드 : parseInt, isNaN 전역객체이기에 생략이 가능하다 예) window.parseInt() => parseInt() window.close() : 창을 닫는다 window.open() : 창을 연다 window.encodeURI(), window.decodeURI() : 주소에 한글이 들어가면 %ECE%EE%EAEGAEAGASE%같은 한글이 이상한 글자로 바뀌는데 encode는 한글 -> 외계어 decode는 …

자바스크립트

2019년 10월 07일 · 3분 분량

[JavaScript] ProtoType에 대한 이해

[JavaScript] ProtoType에 대한 이해

객체지향 클래스는 객체지향 프로그래밍이 기반인 언어에서 필수적인 역할을 한다. 클래스는 코드의 재사용성을 높여주고, 가독성을 올려준다. 필자는 저번주 내내 BlackJack 구현에 메달렸었다. 제일 자신있는 언어인 Java로 객체지향을 상기시키면서 React의 Component, Javascript에서의 ProtoType을 통한 객체지향에 대비했다. 객체지향을 이용한 BlackJack 하나, 객체지향을 이용하지 않고 통으로 코딩한 BlackJack 하나를 구현했는데 처음에는 통으로 코딩하는것이 쉬웠지만 …

자바스크립트