20201019 ~ 20201025

박상록(Sangrok Park)·2020년 10월 26일
0

20201019

  • 런타임이란 프로그래밍이 돌아가는환경, node.js는 Javascript 런타임이다.
  • NVM 설치.

작업 디렉토리에서,

$ touch ~/. bash+profie
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

설치완료 후 꼭 터미널 종료 후 다시 실행.
nvm 버전 확인.

$ nvm —version
  • Node.js 설치 및 원하는 버전 설치

$ Nvm install 12.18.3

노드 버전 확인

$ Node -v

NPM이란 Node Package Manger 모듈 스토어

Package.json

package.json은 해당 프로그램을 실행시키기 위해 필요한 모듈들이 무엇인지, 프로그램을 실행시키는 방법, 프로그램을 테스트하는 방법 등이 명시되어 있다.

다만 실제 모듈은 node module폴더 안에 있음. Package.json은 그냥 어떤 모듈들인지 적혀만 있음.

이점 : 프로젝트 코드를 전달할 때 필요한 모듈이 무언인지만 알려줘서, 실제 사용하는 사람이 npm에서 다운받을 수 있게 할 수 있음. $ npm install 이용 그리고 node_modules 디렉토리 확인

Package.json에 들어있는 내용

  1. Dependencies => 해당 프로젝트가 돌아가기 위해 반드시 필요한 모듈들이 무엇인지가 적혀있음.
  2. devDpendencies => 프로그램 실행에 직접적 영향은 주지 않지만, 개발하는 환경에 필요한 모듈들이 적혀있음. 예를들면 코드모양을 잡아주는 모듈, 테스팅 모듈 등.
  3. Scripts => npm으로 실행 시킬 있는 명령어 정의. 만약, npm start명령이 정의되지 않았다면 npm start 명령시, 정의되지 않은 명령어 오류발생. package.json scripts안에 해당 명령어를 정의 해줘야 함

    ex) “scripts”: { “start”: “node app.js” “test”: “node test.js” }

특이한 점은, Package.json안에 들어가는 내용들은 객체 형태이고, 키(key)값도 꼭 쌍다옴표(double quote)로 적어줘야 한다는 것이다. value값도 string으로 처리되고, 객체인만큼 다음 항목으로 넘어갈떄 꼭 "," 콤마를 찍어줘야 한다.

ex) "scripts": {
      "test": "jest",
      "test:part1": "jest part-1/",
      "test:part2": "jest part-2/__test__/index.test.js"
     }

자료구조

자료구조와 알고리즘은 밀접한 관계가 있어서, 자료구조가 결정되면 그 자료구조에서 사용할 수 있는 알고리즘이 결정된다. 컴퓨터가 자료들을 빠르게 저장, 검색, 분석, 전송, 갱신하기 위해서는 자료구조가 효율적으로 조직화되어 있어야 한다. 또한 각 응용에 가장 적합한 자료구조와 알고리즘을 선택하여야 한다.

알고리즘이란, (1) 문제를 해결할 수 있는 방법을 고안 하는 것. (2) 이 방법에 따라 컴퓨터가 수행하여야 할 단계적인 절차를 기술 하는 것. 이 단계적 절차를 알고리즘이라고 한다. 알고리즘은 특정한 일을 수행하는 명령의 집합.

알고리즘의 정의

입력 : 0개이상의 입력이 존재하여야 한다.
출력 : 1개 이상의 출력이 존재하여야 한다.
명백성 : 각 명령어의 의미는 모호하지 않고 명확해야 한다.
유한성 : 한정된 수의 단계 후에는 반드시 종료 되어야 한다.
유효성 : 각 명령어들은 종이와 연필, 또는 컴퓨터로 실행 가능한 연산이어야 한다.

C언어에서 제공하는 자료형 : 정수, 실수, 문자, 배열(동일한 자료형이 여러개 모인 것), 구조체(다른 자료형이 여러개 모인 것)

추상 자료형(Abstract Data Type) ADT.
소프트웨어의 복잡성 관리를 위해, 추상화관련된 도구들 개발.

추상화란? 어떤 시스템의 간략화된 기술 또는 명세로서 시스템의 정말 핵심적인 구조나 동작에만 집중하는 것.
중요한 것은 사용자에게 강조, 반면 중요하지 않은 구현 세부사항은 제거되는 것. 그리하여 정보 은닉법(information hiding)개발되었고 이것이 추상화로 발전.

————

<자바스크립트 화살표 함수>

함수의 본문에 return 문만 있는 경우 return 생략 가능. 이 때 중괄호 {}는 쓰면 안됨. 하지만 소괄호는 사용 가능

const add = (x, y) => x + y.
const add = (x, y) => (x + y);
Const add = (x, y) ={x + y} // => 불가능. 

화살표 함수는 클로저를 이렇게도 표시 가능
const adder = x => y => x + y;

원래는

const adder = function (x) {
  return function (y) {
    return x + y;
  
  }
}

화살표 함수는 call, apply, bind를 사용할 수 없음
화살표 함수의 실행은 this를 결정짓지 않는다.

"this"

This 는 함수 실행 (invocation)방법에 의해 결정되는 특별한 객체입니다. 함수 실행시 결정. 실행되는 맥락(execution context)에 따라 this 값은 다르게 결정.

This 실행 컨텍스트 5가지

  1. 글로벌 (Global) - console.log(this) (정확히 얘기하면 실행이아닌, Global에서 this를 참조할 때)
  2. Function 호출 - foo()
  3. Method 호출 - obj.foo()
  4. New 키워드를 이용한 생성자 호출 - new Foo()
  5. .call 또는 .apply 호출 - foo.call(), bind().

This 바인딩 패턴

  1. Method 호출 - 온 점 왼쪽에 있는 객체
  2. New 키워드를 이용한 생성자 호출 - 새롭게 생성되는 인스턴스 객체
  3. .call, .apply 호출 - 첫번째 인자로. 전달된 객체

브라우져
  4. Global - window(strict mode에선 undefined)
  5. Function - window(strict mode에선 undefined)

This 바인딩 패턴 in Node.js

  1. Global - module.exports
  2. Function - global

20201020

const nodeList = {
length: 3,
0: 'div#target',
1: 'li',
2: 'span#new'
};

Array.prototype.slice.apply(nodeList, [0, 1])

["div#target"]

———

terminal에서 $은 무언가를 쓰라는 말이다. Prompt 또는 shell이라고도 한다.

20201021

배열 안 객체를 객체안 정보를 기준으로 오름차순, 내림차순으로 정렬하고 싶을 때

  • Array안에 객체가 있을 때, 객체 안 어떤 값을 기준으로 배열순서를 정렬하고 싶으면 예를들어 age프로퍼티라 하면, Array.sort( (a, b) => {if(a.age > b.age) {return 1} else {return -1}}). 이런식으로 하면 객체 안 나이 순서대로 배열의 순서를 변경할 수 있다.

nvm.js에 가면 nvm module들을 볼 수 있다.

eslint가 새로작업하는 프로젝트와 버전이 안맞아 제대로 작동을 안할 때가 있다.
eslint는 각 프로젝트마다, 버전이 다른경우가 많기에 Global로 깔지않는 것을 추천한다
nvm uninstall eslant —global

eslint가 글로벌로 깔렸는지 안깔렸는지 확인하는 법

Npm ls 는 현재 디렉토리에 깔려있는 module들을 다 볼수 있다.

NPM LS —depth = 0

화살표 함수의 this

화살표 함수는 this값을 가지지 않는다 고로 call, this, bind를 쓰지 않는다

일반함수는 생성될 때 자체의 this값을 가지게 된다.

setTimeout 의 this는 window를 가르킨다.

그냥 함수안에서 가르키는 this값은 Window
function handleClick() {
console.log(this)
}

이 this값을 바꿔주려면, bind를 이용해서 바인딩 해면 된다.

——————

20201022

Spread syntax는 객체를 쉘로우 카피 한다.

Spread in object literals
The Rest/Spread Properties for ECMAScript proposal (ES2018) added spread properties to object literals. It copies own enumerable properties from a provided object onto a new object.
Shallow-cloning (excluding prototype) or merging of objects is now possible using a shorter syntax than Object.assign().
let obj1 = { foo: 'bar', x: 42 };
let obj2 = { foo: 'baz', y: 13 };

let clonedObj = { ...obj1 };
// Object { foo: "bar", x: 42 }

let mergedObj = { ...obj1, ...obj2 };
// Object { foo: "baz", x: 42, y: 13 }

Note that Object.assign() triggers setters, whereas spread syntax doesn't.


Peek operation

In computer science, peek is an operation on certain abstract data types, specifically sequential collections such as stacks and queues, which returns the value of the top ("front") of the collection without removing the element from the collection. It thus returns the same value as operations such as "pop" or "dequeue", but does not modify the data.

——————

자바스크립트에는 변수명, 함수명으로 사용할 수 없는 keyword가 존재한다.

https://www.w3schools.in/javascript-tutorial/keywords/

EcmaScript 5기준 63개

booelan, abstract, class, if, arguments 등이 있다.

객체 안에 있는 함수를 매소드라 한다.

stack과 후위 표기법.

SE발표법

나는 어떤 사람인지?
코드스테이츠에 왜 들어왔는지?
What I like?

무엇을 하다가?

SE발표자 분께서 고등학교때 공부만 하다가, 대학교를 갔는데, 공부만하던 내자신이 별로였다고 한다 대외활동, 봉사활동 해외봉사 많이 했고, 생명공학 전공. 채용 때 무슨일이 있었는지.

어떤 계기로?

어떤 개발자가 되고 싶은가?

ALUMNI

—————————

기억보단 기록을 매일매일 배운 것을 적다보면 나중에 나에게 분명히 도움이 된다.

20201023

자료구조가 다양하다는 것은 자료구조의 저장법에 다양한 문제가 있다는 것이고, 다양한 해결법이 존재한다는 것.

연결리스트의 요소는 메모리에 연속적으로 할당될 수 있는가?

  • Yes

배열은 알아서 이름붙이고(인덱스), 나열을 한다


자바스크립트 해석기: 자바스크립트 엔진. 대표적인 엔진은 브라우져,

링크드 리스트에서 Head만 제거하면 모든 노드를 다 제거할 수 있다. 그러면 가비지 콜렉션이 진행된다!

자바스크립트에서는 어디에선가 그 데이터를 기억하고 있으면, 그 데이터는 살아있다.

배열, 그래프, 바이너리 서치 트리, 기업 코딩 테스트 때 많이 나온다. 해시테이블 가끔 구현할줄 아는지 물어보는 회사도 있다.

자신을 몰아 붙였다.

손파일링을 하라.

여러분이 어렵다면, 그건 낮선거다. 익숙하지 않은 것이다.

논리학을 공부 많이 한사람
언어뿌리를 많이 공부하신 사람
경제학 가설을 세우고 데이터를 많이 봤던 사람은
이 사고구조가 생긴것일수도 있다.

그렇지 않다고 해서 적성이 없는게 아니다.
우리가 배우고 있는 것은 학습이 가능하다.

복습의 방법.

링크는 두번이상 타지 마라.

뭔가를 외울 때 [정의]는 그냥 받아들여야 한다.
뭔가를 외울 때는 이름을 외우듯이 자주 봐야한다.
빗자루로 쓰레기를 쓸어담듯이 자주 쓸어담듯이 공부해야 한다.
에빙하우스 망각곡선
머리에 아세톤을 발라놓은 것 같다.

1137

세븐 일레븐

일곱시에 일어나서 11시에 자면 된다. 그사이에 다 공부하면 된다.

책 추천

  • 나에겐 지금 못할것이 없다 2 : 목표 편

20201024

자바스크립트 class에 꼭 constructor () 가 있어야 하나? 검색해 봤더니

Definition and Usage
The constructor() method is called automatically when a class is initiated, and it has to have the exact name "constructor", in fact, if you do not have a constructor method, JavaScript will add an invisible and empty constructor method. Note: A class cannot have more than one constructor() method. 출처:W3Schools

20201025

클라이언트 서버 구조의 문제점: 서버의 과부하.

모든 요청이 서버로 집중되기에 수십만명의 클라이언트 를 처리하기 위해 많은 서버와 큰 용량의 네트워크가 필요함 .

데몬이란?

출처: 쉽게 배우는 운영체제(조성호)

profile
한 줌의 소금과 같이 되고 싶은 개발자

0개의 댓글