전체 글280 [220127] 콜백함수를 활용한 자동차 레이싱 게임 [ 목표 ] 세 대의 차를 아반떼>소나타>제네시스 순서대로 출발시킨다. 출발할때 GO!라는 텍스트를 표시한다. 도착할때 END!라는 텍스트를 표시한다. 한대의 차가 출발하고 도착하고나서 다음 차가 출발하게 한다. 3대의 차가 도착하고나면 경기끝!이란 텍스트를 표시한다. 시도 1) 우선 콜백함수를 차례대로 생성해서 출력값을 만들어서 결과값을 보자. const 아반떼 = () => { console.log('아반떼 GO!') setTimeout(()=>console.log('아반떼 END!'),1000) } const 소나타 = () => { console.log('소나타 GO!') setTimeout(()=>console.log('소나타 END!'),1000) } const 제네시스 = () => { c.. 2022. 2. 2. [220107] 익명함수, arrow함수, 함수가 생성되고 호출되는 순서 목록 1. 함수를 선언하는 여러가지 방법 2. 함수가 생성되는 순서 3. 익명함수 4. 호출되는 순서 함수를 선언하는 여러가지 방법 function test(){ console.log("hello world!") } let elementObj = { addEventListener:함수,} elementObj.addEventListener("click",test) elementObj.addEventListener("click",function(){console.log('익명함수')}) elementObj.addEventListener("click",function(){console.log('두번째')}) elementObj.addEventListener("click",()=>console.log('세번째'.. 2022. 2. 2. [220105] 콜스택과 메모리힙, 스택과 힙, 메모리 할당 순서 목록 1. 스택구조 2. 큐구조 3. 콜스택 4. 메모리힙 간단한 자료구조를 배웁시다 : 스택 구조, 큐 구조 알고 있던것 같더라도 막상 설명하려고하면 어 뭐더라..?하고 생각하게 되는 스택과 큐 구조의 차이점을 알아보자 스택구조(LIFO) Last in , First Out / 후입선출 프링글스통에 들어가있는 과자를 생각하면 편함. 가져오기 O(n) -> 시간복잡도 여러번 반복할때 실행하는 횟수 for문처럼 저장하기 O(1) -> 한번 실행할때 삭제하기 O(1) -> 위에서부터 삭제(추가도 마찬가지. 한 방향으로만 가능한 스택) 큐구조 (FIFO) First in, First Out / 선입선출 편의점 냉장고를 생각하자. 뒤에서 순서대로 채우지만 꺼낼때는 앞에서 꺼냄. 가져오기 O(n) 저장하기 O(.. 2022. 2. 2. [220128] nunjucks 설치, 세팅, 사용 목록 1. 템플릿엔진 2. nunjucks 설치 3. nunjucks 세팅 4. nunjucks 사용 5. nunjucks 흐름 이해도 (링크) node.js 시작하기전 프로그램 세팅하는 법은 여기에! https://hancoco.tistory.com/70?category=1035202 [220125] 맥북에서 터미널, nodejs 개발환경 세팅하기 (M1칩) + 용어설명, npm, nvm, express 터미널 명령어 알기 기본적인 명령어 ls : 현재 있는 디렉토리 안의 파일 리스트를 출력해주는 -a : 숨긴 디렉토리까지 보여줌 -l : 자세히 보기 pwd : 어떤 디렉토리 경로에 있는지 절대 경로로 표 hancoco.tistory.com 템플릿 엔진 웹 개발에서, 지정된 템플릿 양식과 데이터가 합쳐.. 2022. 2. 2. [220127] promise, then, resolve 목록 1. promise의 목적 2. promise의 매개변수 2가지 3. then 사용법 4. promise의 상태 3가지 5. resolve 사용하는 법 promise를 사용하기 위한 선수지식 : 객체와 this 간단 정리! this에 관한 자세한 설명은 아래 블로그 게시글에 --> https://hancoco.tistory.com/36 [220107] this와 new 그리고 arrow function 객체를 만드는 놀라운 기술을 배웠다! 이제 대량생산을 어떻게 쉽고 간단하게 만드는지 알아보자. 객체란 붕어빵을 만드는 붕어빵 틀, this !주의! 우선, 가볍게만 알자. 깊게 들어가면 내용이 상 hancoco.tistory.com promise의 목적 콜백 기능은 그대로! 하지만 코드는 좀 더 깔끔.. 2022. 2. 2. [220127] require, export 명령문 목록 1. require 메서드 2. exports를 통해 추가하기 NODEJS의 require 메서드 require은 표준 문법이 아니다 : 표준에 없는데 왜 nodejs에 이게 필요할까? 자바스크립트는 여러 파일에서 사용할 경우, 불편했다. 왜? A 파일에 있는 변수가 왜 B 파일에서 실행될때 같이 실행되지? (브라우저의 예시) 다른 사람들과 협업할때 불편함. (예시) 내가 a변수를 만들었는데, 다른사람도 a변수를 선언하거나 사용 --> 에러발생 이를 방지하기 위해 모듈(파일을 가져와서 사용할 수 있게끔 만들어 주는 시스템)이 나옴. 모듈은 ES7부터 있었음. -> import문이 생겨있음 근데!! import가 나오기 전에 NODEJS가 먼저 만들어 놓은 require가 존재. import(리액트때.. 2022. 2. 2. [220125] 맥북에서 터미널, nodejs 개발환경 세팅하기 (M1칩) + 용어설명, npm, nvm, express 목차 1. 터미널 명령어 2. npm 사용하기 3. express 사용하기 4. 서버 실행하기 터미널 명령어 알기 기본적인 명령어 ls : 현재 있는 디렉토리 안의 파일 리스트를 출력해주는 -a : 숨긴 디렉토리까지 보여줌 -l : 자세히 보기 pwd : 어떤 디렉토리 경로에 있는지 절대 경로로 표시해준다. Print Working Directory의 약어 cd : 작업하는 디렉토리의 위치를 바꾸는 명령어. Change Directory의 약어 mkdir : 디렉토리를 만들어준다. clear : 터미널 화면을 비워준다. d... 디렉토리 - ... 파일 / : 최상위 디렉토리 cd / : 최상위 디렉토리로 이동 cd /root : 루트 디렉토리로 이동 /home/계정명 : 홈디렉토리 맥이랑 리눅스랑 비슷.. 2022. 2. 2. [220125] 맥북에서 터미널 켜는 단축키 만들기 (M1칩) ( 맥북을 사용하는 관계로 맥OS 기준으로 작성.) 윈도우와 다르게 맥OS는 터미널만 켜서 설치가 가능하다고 한다! 윈도우 단축키는 shift+ctrl + t 라고 한다. 보통 맥북은 윈도우와 설정이 비슷하니 눌러봤지만. 음 안된다. 맥북은 터미널 단축키가 없다고 한다. 그러면 만들자. 단축키는 편리한 것이다. 1. application에서 Automator을 실행 2. 실행한 후 처음 뜨는 화면에서 새로운 문서 선택 3. 빠른 동작 선택 4. AppleScript 실행을 드래그 한 후 다음 코드를 작성 여기서 주의할 점 2가지! 작업흐름 수신을 반드시 입력없음으로 선택해야 한다. 저거 몰라서 세번이나 다시 지웠다가 설치했다. AppleScript 실행 코드 박스 빨간 박스 안에 수정코드를 작성해야하는데.. 2022. 2. 2. [220125] NODEJS, 무작정 맥에서 시작하기 (M1칩) ( 맥북을 사용하는 관계로 맥OS 기준으로 작성.) 윈도우와 다르게 맥OS는 터미널만 켜서 설치가 가능하다고 한다! dock에 등록해서 실행하는 법도 있겠지만, 귀찮아서 단축키를 만들어서 쓰고 있다. 단축키 등록법은 아래 참조 https://hancoco.tistory.com/69 [220125] 맥북에서 터미널 켜는 단축키 만들기 (M1칩) ( 맥북을 사용하는 관계로 맥OS 기준으로 작성.) 윈도우와 다르게 맥OS는 터미널만 켜서 설치가 가능하다고 한다! 윈도우 단축키는 shift+ctrl + t 라고 한다. 보통 맥북은 윈도우와 설정이 비슷하니 hancoco.tistory.com 최초에! 한번만! 실행하는 설치 1. homebrew 설치하기 https://brew.sh/ /bin/bash -c "$(.. 2022. 2. 2. [220128] 콜백 함수와 익명함수의 차이점, 콜백지옥 익명함수와 콜백함수의 차이점 익명함수 이름 없이 생성된 함수라고 생각하면 된다. 함수명 대신 변수명에 저장되고, 호출할때 변수명을 사용하면 된다. function을 생략하고 =>을 가진 모양으로도 나타낼 수 있으며, 화살표를 달고있다고해서 애로우 함수라고도 한다. 익명 함수에 대한 자세한 설명글은 아래 게시글에 적어놓음. let abc = function() { console.log('익명함수') } let abc2 = () => { console.log('익명함수') } https://hancoco.tistory.com/75 [220107] 익명함수, arrow함수, 함수가 생성되고 호출되는 순서 목록 1. 함수를 선언하는 여러가지 방법 2. 함수가 생성되는 순서 3. 익명함수 4. 호출되는 순서 함수.. 2022. 1. 28. 이전 1 ··· 21 22 23 24 25 26 27 28 다음
