JS 9

181210 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.12.10 강의자 : 김민태님 앱을 만들 때 처음 할일 초기화 -> 상태 생성(초기 상태), 이벤트 핸들러 연결 todo앱 만들기 첫번째 예제처럼 전역에 배열을 생성하고 메소드를 만드는 방식의 단점은 전역공간에 생기기 때문에 충돌이 날 수 있다. 따라서 전역공간에는 코드를 작성하지 않는다. (의도하지 않았는데 덮어쓸 수 있는 오류가 생길 수 있다) 전역에 객체를 만들어서 객체 안에 메소드 등 코드를 작성하면 적어도 객체 안의 내용은 보호가 된다. -> name scope, name space todoApp { //코드내용 } // name scope let TodoApp = { todos: [], start() { let inputEleme..

181205 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.12.05 강의자: 김민태님 ## 연산자 후치연산자 a = 10; a++ +5;//15 새로운 연산자 spread(확산) let 열대과일 = ['두리안', '파파야', '아보카도']; let 맛있는과일 = ['사과', '배', '수박']; let 과일 = [...맛있는과일, ...열대과일]; console.log(과일); // 두개의 배열을 하나로 만든다 로컬 - 리모트(원격) let request = new XMLHttpRequest(); request.open('GET', '/api/books', true);//요청방식/요청주소/동기적,비동기적인것에 대한 true,false, 디폴트는 true,비동기 방식이다. //api폴더밑에 book..

181126 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.11.26 강의자: 김민태님 ## promise 비동기 작업의 결과거 성공되었는지 실패되었는지 표시하기 위해 사 모든 비동기 작업의 처리결과는 두가지. 성공과 실패 코드의 흐름이 두세배 복잡해진다. new 인스턴스를 사용해서 Promise(함수); 프로미스 생성자가 함수를 즉시 호출하면서 성공실패를 resolve, reject, 성공/ 실패. 둘다 함수이고 promise가 전달해주는 함수. 단순히 비동기 처리 하나를 위해서 나온것이 아니다. 단순 비동기 작업을 처리하면 더 복잡해질 수 있다. 비동기 작업의 복잡도가 높아질 때 promise를 사용하면 작업이 단순해진다. function asyncT1(resolve, reject) { //pr..

181121 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.11.21 강의자: 김민태님 map, filter - 배열을 순회하면서 함수에서 리턴한 값을 배열로 만들어서 리턴한다 ## map a라는 형태의 데이터를 b라는 형태의 데이터로 바꿀 때 많이 사용한다 ## filter 필터링. 리턴하는 배열은 바뀌지 않는다. 안의 함수가 true, false를 확인해서 true를 반환한 값만 모아서 배열로 리턴. let idol = [ { age: 10, type: '남성', name: '방탄소년단' }, { age: 5, type: '남성', name: '샤이니' }, { age: 14, type: '남성', name: '동방신기' }, { age: 2, type: '여성', name: '2NE1' } ]..

181119 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.11.19 강의자 : 김민태님 ## 함수 가변인수, 함수 인수의 개수가 가변적인 것. 함수는 함수의 만들어진 목적대로 활용이 되려면 값의 종류와 인수의 개수를 검사해야한다. 인수의 검증. 가장 기본적인 방법은 if문을 사용해서 인수를 확인하는 방법. 함수의 사양보다 많이 전달된 인수는 함수 호출과 함께 유사배열(arguments)에 담겨서 전달된다. 이 arguments는 언제나 전달된 모든 인수가 왼쪽부터 오른쪽 순서대로 담겨진다. 함수 호출될때마다 전역으로 만들어진다. 배열처럼 사용이 가능한 것. 배열의 기본적인 형태만 사용가능하기 떄문에 유사배열이라고 한다. 순서대로 들어가있는 요소. 브라켓을 사용해 순서대로 값에 접근이 가능하다. l..

181105 - TIL

주제: 자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.11.05 강의자: 김민태님 prompt(), alert() - 함수, 모양을 보아도 함수. ()호출하고 있다. window.prompt() -> window객체에 있는 prompt메소드 window는 가장 상위에 있는 전역객체이기 때문에 생략이 가능. prompt의 반환값은 모두 문자열. 숫자입력도 문자열로 리턴한다. 내가 무엇인가를 만드려고 할 때 그림으로 그려보자(최대한 단순하게 그림으로 도식화하기) 문제가 여러개가 있고 사용자가 답을 입력하는 프로그램 만들기 문제1) 문제가 여러개다. -> 배열, 객체 여러개지만 문제에 각 이름은 필요없다 -> 배열(문제데이터) 답도 여러개다. -> 배열(정답데이터) 문제가 여러개가 들어있다. 문제를..

181031 - TIL

주제:자바스크립트 강의: 자바스크립트 부트캠프 날짜: 2018.10.31 강의자: 김민태님 ## 실행과 실행 흐름의 개념이해 문 - 값이 아닌것, 분기점을 만드는 것. 값은 바꿀수 없다. 10은 10일뿐 11이 아니다. A도 A일뿐 B가 아니다. 값자체는 바꿀수 없지만 값을 담은 상자(변수)에는 값을 넣었다 뺐다 하면서 비교한다. 마치 값이 바뀐것'처럼', 값은 상태라고 할 수 없다. 상태는 변할 수 있지만 값은 변할 수 없는 것이기 때문에. 상자(변수)가 생기면서 상태라는 것이 생김. age = age + 1; // 대입문, 값 =(문) 값(식) 제어문 / if문 - 참과 거짓이 나옴 ## 반복과 반복문 반복문 while - 원하는 상태동안. 참,거짓이 필요하다. 조건에 따라 한번도 실행 안할수도 있다..

javascript30 - keyboard drum kit

자바스크립트30(https://JavaScript30.com) - day1 을 만들면서 알게 된 내용들 -코드는 깃헙에 올려놓았고 JavaScript30 의 내용을 fork한 후 각 DAY폴더에 mywork.html을 만들어 작업하고 있다(start.html, finished.html은 손대지 않기!!!) ##currentTime; The HTMLMediaElement.currentTime property gives the current playback time in seconds. Setting this value seeks the media to the new time. 모질라에서 제공하는 docs에는 위처럼 설명이 나와있다. 짧은 영어로 이해한 내용을 정리하면, 'currentTime을 사용해서 시..

요즘 듣고 있는 강의

인프런을 열심히 듣다가 벨로퍼트님의 리액트 초급 강의를 끝으로 잠깐 쉬었다.바쁨에 극심한 더위로 인해 퇴근하고 집에 오면 아무것도 할 수 없었다(에어컨만 있고 설치를 안해서 올 여름을 선풍기로 버텼다ㅠㅠ) 극심한 무더위에 무기력증까지 더해져 인강을 한동안 듣지 않다가 날씨가 선선해지면서 다시 인강을 듣기 시작했다 현재 듣고 있는 강의는 두개!내가 듣고싶은 코드스쿼드의 강의가 있길래 냉큼 듣고 있다 #### 정호영님의 깃과 깃헙강의 회사에서 소스트리를 사용하고 있는데 정말 커밋, 풀, 푸시, 머지, 브랜치 생성 다 할 수 있지만정확히 모른 상태에서 '일을 위해' 배운 거라 정확한 깃 사용법을 익히기 위해 듣고 있다소스트리같은 gui툴이 아닌 cli 방식으로도 사용해 보고싶지만 우선 소스트리로 익숙해 진다음..

주절거림 2018.09.06