자바스크립트
-
[TIL] 2020-03-08Trainings/이전 TIL 기록 2020. 3. 8. 23:54
[노마드 코더] ReactJS로 웹 서비스 만들기 #3.1 All you need to know about State까지 수강 [배운 내용] this의 값은 함수를 호출하는 방법에서 결정된다. 1. 전역에서 this console.log(this); // window {...} this.a = 'A'; console.log(window.a) // 'A' this.hello = 'world'; console.log(window.hello) // 'world' cat = "Meow"; console.log(window.cat) // 'Meow' console.log(cat) // 'Meow' thist는 기본적으로 전역 객체인 window에 바인딩된다. 2. 함수에서의 this function foo() {..
-
[TIL] 2020-03-06Trainings/이전 TIL 기록 2020. 3. 6. 23:00
[노마드 코더] 1. 바닐라 JS로 게임 만들기 수강 완료! 2. ReactJS로 웹 서비스 만들기 #2.0 Creating your first React Component까지 수강 [배운 내용] cmd 명령어 "mkdir" 은 명령어 뒤에 디렉토리명을 적어 새로운 디렉토리를 생성해준다. // mkdir helloworld "cd" 원하는 디렉터리로 이동하는 동작을 한다. // cd helloworld "ls" 명령어로 하위 디렉토리명을 확인 가능하다. git 명령어 git init : Git 저장소를 만들어주는 명령어. 실행하면 현재 디렉터리를 Git 저장소로 만들어준다. // git init git remote : 변경 내용을 반영할 원격 저장소를 조작한다. 'git remote'로 원격 저장소의 이..
-
[TIL] 2020-03-04Trainings/이전 TIL 기록 2020. 3. 4. 23:23
[노마드 코더] 바닐라 JS로 게임 만들기 #2. 2 Recap! 까지 수강 [생활코딩] HTML - form 태그 복습 [프로그래머스 JS 강의] Callback Function 조건을 등록해 두고 그 조건을 만족한 경우, 나중에 호출되는 함수 setTimeout( function, time ) time 시간이 지난 경우 function 함수를 콜백하는 함수 time 은 millisecond (1/1000초) 단위 timerId를 반환함 clearTimeout( timerId ) setTimeout 함수 호출의 결과로 반환된 timerId를 인자로 받아 예약되어 있던 function호출을 취소 이미 function이 호출된 경우(시간이 지나 이벤트가 발생한 경우)에는 효과 없음 setInterval( ..
-
[TIL] 2020-03-03Trainings/이전 TIL 기록 2020. 3. 3. 22:34
[노마드 코더] 바닐라 JS로 게임 만들기 #1Setup + Styles까지 수강 [프로그래머스] 자바스크립트와 웹 프론트엔드 파트 2. DOM + JS까지 수강 [배운 내용 정리] HTML, CSS, JS의 개념 HTML : 웹 페이지의 구조를 나타낸다. CSS : 웹 페이지 안에 존재하는 요소들의 스타일을 나타낸다. JS : JS로직을 통해 문서의 구조와 스타일에 변화를 줄 수 있다. 브라우저에서는 Javascript에서 HTML, CSS에 접근할 수 있는 API를 제공한다. window 객체 Javascript 실행 시 가장 상위에 존재하는 객체이다. 변수를 선언하거나 함수 선언 시 window 객체 안에 선언됨 표시된 웹 페이지의 정보에 접근하거나 변경을 할 수 있다. [종류] window.loc..
-
[TIL] 2020-03-02Trainings/이전 TIL 기록 2020. 3. 2. 22:42
[CSS] 문법 정리 [노마드 코더] 바닐라 초급 JS 수강 완료! [배운 문법] API란? → Application Programming Interface, 응용 프로그램 프로그래밍 인터페이스는 응용 프로그램에서 사용할 수 있도록, 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스를 뜻한다. “ 운영체제나 프로그래밍 언어가 제공하는 기능 ” → SK의 날씨정보, Daum의 지도정보, 카카오페이를 뜻한다. “응용 프로그램” → 우리가 만든 서비스라고 생각하면 이해가 편하다. fetch() 인자로 전달된 데이터를 서버로부터 서버에게 요청하는 방법이다. "Hello World!" fetch('html'). then(function(response){ response.text(). ..
-
[TIL] 2020-03-01Trainings/이전 TIL 기록 2020. 3. 1. 23:52
[노마드 코더] 바닐라 자바스크립트 #3.8 Image Background까지 수강 [배운 문법] event.target 이벤트가 발생시, 이벤트가 발생하는 해당 객체를 반환 filter() 배열 원소들을 반복하면서 조건(함수)에 true면 원소를 남기고 false면 없애버린다. 이것도 새로운 배열이 탄생한다. 배열 값들 중에 의미 없는 값들을 버릴 때 사용한다. 그냥 필터 건다고 생각면 편하다. parentNode() 부모 노드를 찾을 때는 parentNode 속성을 사용한다. 자식 노드는 여러 개일 수 있기 때문에 children이나 childNodes 같은 복수형 단어를 썼다면 부모는 항상 한 명이기 때문에 단수형 parentNode이다. new Image() 그림에 대한 정보를 알려주는 Image..
-
[TIL] 2020-02-29Trainings/이전 TIL 기록 2020. 2. 29. 22:39
[노마드 코더] #3 Make your first JS App 3.6까지 수강 [배운 문법] new Date는 날짜와 시간(년, 월, 일, 시, 분, 초, 밀리초(천분의 1초(millisecond, ms)))을 위한 메소드를 제공하는 빌트인 객체이면서 생성자 함수이다. 1. getYear() : 실제 연도에서 1900을 뺀 값을 출력한다. 2. getTime() : 1970년 1월 1일 자정을 기준으로한 밀리초 값을 보여준다. 3. getDay() : 요일 데이터를 기준으로 숫자가 출력된다. ex) 0은 일요일, 1은 월요일 4. getMonth() : 실제 월 값보다 1이 작다. ex) 1월은 0, 3월은 2 .. 5. getMinutes() : 분(minutes), 0~59, 0부터 시작함에 주의 6..
-
[TIL] 2020-02-28Trainings/이전 TIL 기록 2020. 2. 28. 23:29
[노마드 코더] DOM이란? → Document Object Model의 약자이며, BOM 중 하나이면서, 웹 문서의 모든 요소를 자바스크립트를 이용하여 조작할 수 있도록 객체를 사용하여 문서를 해석하는 방법을 의미한다. BOM이란? → Browser Object Model 의미하며, 브라우저 객체 모델의 최상위 객체는 window라는 객체가 있고, DOM은 window 객체의 또 하나의 객체이기도 하다. 문서 노드(Document Node) 트리의 최상위에 존재하며 각각 요소, 어트리뷰트, 텍스트 노드에 접근하려면 문서 노드를 통해야 한다. 즉, DOM tree에 접근하기 위한 시작점(entry point)이다. 요소 노드(Element Node) 요소 노드는 HTML 요소를 표현한다. HTML 요소는..