분류 전체보기48 [Backend] 프로미스 콜백 헬이라고 불리는 지저분한 자바스크립트 코드의 해결책 = 프로미스 프로미스: 내용이 실행은 되었지만 결과를 아직 반환하지 않은 객체. 결과가 출력되기 전까지 결과를 들고다닌다. then이나 catch를 붙여서 결과를 반환받을 수 있다. 실행이 완료되지 않았으면 완료된 후에 then 내부 함수가 실행됨 promise는 어떤 동작을 한다. 예를 들면 어떤 파일을 읽어 온다든지, 네이버와 같은 웹사이트에 요청을 보낸다든지. 동작의 결과(성공 or 실패)에 따라 실행되는 코드가 나뉜다. resolve(성공 리턴값)를 호출하면 then으로 연결한다. reject(실패 리턴값)를 호출하면 catch로 연결한다. finally 부분은 무조건 실행된다. const condition = true; //true면 re.. 2023. 1. 26. 비구조화 할당 javascript에서 코드를 간결하게 만들기 위해 생긴 문법이다. 예전에는 다음과 같이 세 줄로 써야했던 코드를 const example = { a:123, b: { c: 135, d:146 }} const a = example.a; const d = example.b.d; 비구조화 할당을 사용하면 한 줄로 작성 가능하다. const { a, b: {d}} = example; //example에서 a와 b 안의 d를 꺼내두라는 뜻이다. 콘솔을 찍어보면 다음과 같은 출력이 나온다. console.log(a); //123 console.log(d); //146 예제를 하나 더 살펴보자. 배열을 사용하는 경우에도 비구조화 할당을 하면 코드가 간결해진다. arr = [1,2,3,4,5]; const x = a.. 2023. 1. 26. 화살표 함수 앞서 설명한 const 와 let은 var을 완벽하게 대체할 수 있지만, 화살표 함수는 function을 완벽하게 대체할 수는 없다. function을 사용한 기존 문법 function add1(x, y) { return x+y; } 화살표 함수 사용 const add2 = (x, y) => { return x+y; }; //함수명 대신 변수명을 쓰고, = (parameters) => 를 사용. 중괄호 뒤에 바로 return문이 나온다면, 이 둘을 모두 생략해도 된다. const add3 = (x, y) => x+y; 위 방법을 사용하면 간결하지만 헷갈릴 수 있기 때문에 대부분 리턴 값을 소괄호로 묶어준다. const add4 = (x, y) => (x+y); 객체를 리턴하는 경우, 소괄호가 필수이다. .. 2023. 1. 25. 템플릿 문자열, 객체 리터럴 탬플릿 문자열 프로그래밍을 하다 보면 종종 다음과 같은 코드를 작성하는 경우가 있다: var won = 1000; var result = '이 과자는 '+won+'원입니다.' 그런데 이런식으로 +로 출력문을 연결하게 되면 띄어쓰기를 고려해야하고 변수가 많아지면 식이 복잡해진다. 그래서 나온 게 탬플릿 문자열이다. ${}안에 변수명을 작성하면 된다. var won = 1000; const result = `이 과자는 ${won}웝입니다.`; cf) tagged template literal function(){} 내부에 함수 내용을 작성한 후, a(); 로 함수를 호출할 수 있다. 하지만 다음과 같이 소괄호()말고 백틱`을 사용해 함수를 호출할 수도 있다. a``; 이를 tagged template lit.. 2023. 1. 24. var, const, let var: 블록 스코프 {} 밖에서도 유효함. const: 블록 스코프 {} 밖에서는 유효하지 않음. 하지만 function 스코프 function a(){} 밖으로는 var, const 모두 유효하지 않다. 따라서 var은 함수 스코프를 따르고, const는 블록 스코프를 따른다고 말한다. const에는 =를 한번만 쓸 수 있다. 따라서 const a=3; 으로 초기화하고 a= '5'; 등으로 값을 바꾸려고 하면 에러가 난다. 하지만 const에 객체를 넣은 경우에는 값 변경이 가능하다. 예를 들어, const b = { name: 'hhk' }; b.name = 'hkhkhk'; 와 같이 const 내의 객체의 값을 변경하는 것이 가능하다. js에서는 const를 처음 정의할 때 =를 무조건 딱 한 번.. 2023. 1. 24. [Backend] 서버로서의 노드 서버로서의 노드 서버: 네트워크를 통해 클라이언트에 정보나 서비스를 제공하는 컴퓨터 또는 프로그램 클라이언트: 서버에 요청을 보내는 주체(브라우저, 데스크탑 프로그램, 모바일 앱, 다른 서버에 요청을 보내는 서버) 예시 브라우저(클라이언트, 요청)가 웹사이트(서버, 응답)에 접속 핸드폰(클라이언트)을 통해 앱스토어(서버)에서 앱 다운로드 노드 != 서버 But, 노드는 서버를 구성할 수 있게 하는 모듈(4장에서 설명)을 제공한다. cf) 노드 설치 후 버전 확인하는 방법 //node, npm 버전 node -v npm -v //npm 업그레이드 하기 i -g npm 2023. 1. 6. [Backend] Node.js란? 공식 홈페이지의 설명 Node.js는 크롬 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임이다. 노드 == 서버인가? 서버의 역할도 수행할 수 있는 "런타임"이다. 노드는 자바스크립트(언어)로 작성한 코드를 실행해 서버를 만드는 역할을 한다. 서버 실행을 위해 필요한 http/https/http2 모듈을 제공한다. 노드는 자바스크립트의 런타임이다. 런타임: 특정 언어로 만든 프로그램을 실행할 수 있게 해주는 가상 머신의 상태 노드는 자바스크립트로 만든 프로그램(서버이든 게임이든..)을 실행할 수 있게 해줌 다른 런타임으로는 웹 브라우저(크롬, 엣지, 사파리, 파이어폭스 등)가 있음 노드 이전에도 자바스크립트 런타임을 만들기 위한 많은 시도가 있었으나, 엔진 속도 문제로 실패함 노드는 single t.. 2023. 1. 6. [Colab] 코랩과 구글 드라이브 연동하기 Google Colab으로 프로젝트를 진행할 때, 로컬 환경에 데이터를 저장하고 불러오는 대신 구글 드라이브에 존재하는 데이터를 Colab에 가져다 쓰고 싶은 경우가 있습니다. 이런 경우 데이터를 코랩에 올리는 행위를 mount한다고 부르는데, 코드 단 두 줄을 사용해 매우 간단히 진행할 수 있습니다. 다음은 사용자의 구글 드라이브를 코랩 내 /content/drive에 mount하는 코드입니다: from google.colab import drive drive.mount('/content/drive') 1. 코랩에서 위 코드 블럭을 실행하면 다음과 같은 팝업이 뜹니다. 'Google Drive에 연결' 버튼을 눌러서 Colab이 Google Drive에 엑세스하는 것을 허용합니다. 2. 그러면 다음과 .. 2023. 1. 2. Sorting Algorithm [Selection Sort] Idea 왼쪽과 오른쪽 2개의 리스트 생성한 후, 초기 상태에서 모든 숫자를 오른쪽에 넣고, 오른쪽에서 가장 작은 숫자를 왼쪽으로 옮긴다. 이 과정을 오른쪽 리스트가 공백이 될 때까지 반복한다. 하지만 이런 방식으로 구현하면 정렬하려는 리스트와 크기가 같은 리스트를 하나 더 만들어줘야 하므로 메모리가 소비된다. 따라서 추가적인 리스트를 생성하지 않고 정렬하는 방법을 선택하도록 하자. 입력 배열에서 최솟값을 발견한 다음, 이 최솟값을 배열의 첫번째 원소와 교환(swap)한다. 이 절차를 (정렬하고자하는 숫자 개수 - 1)번 반복하면 숫자를 정렬할 수 있다. Psuedo Code selection_sort(A, n); //A는 정렬하고자 하는 리스트, n은 원소의 개수 for i 2022. 12. 11. 이전 1 2 3 4 5 6 다음
