본문 바로가기

분류 전체보기

(99)
[코드스테이츠 FE 부트캠프 40기] 섹션1 회고 🏔나의 목표 되새기기 외국계 기업에 개발자로 취직하여 디지털 노마드의 꿈을 이루고 싶다. 다만, 삶의 질은 또 포기 못하므로 그 와중에 돈은 좀 많이 벌었으면 좋겠다. (ㅎㅎ) 👍🏻KEEP 수업시간에 나왔던 개념은 되도록 까먹지 않도록 블로깅을 하면서 복습을 하고자 했는데, (꾸역꾸역이라도) 복습을 하고 있다는 점. 공부시간엔 아무리 뭔가 할일이 일찍 끝났어도 (드러눕지말고…)뭔가 다른걸 공부라도 하면서 생산적인 시간을 보내기로 다짐했는데, 나름 잘 해온것 같다. 주말에 아르바이트를 하고 와서 코딩을 한 점. 👎🏻PROBLEM KEEP에서 잘 지키고 있던 사항들도 지난 몇일, 코로나로 인해 조금 소홀해졌다. 몸이 피곤하고 집중이 안되다보니 복습도 밀리고 많이 속상하다. 😂 역시 코로나로 인해 운동도 못하..
[javaScript]객체 메서드 정리 & 객체의 반복문과 복사 객체란 객체란 순서가 없는 키와 값 묶음의 조합이다. 이름표가 붙여진 폴더들을 보관하는 서랍장같은 것! 상자를 열면 각각의 자료가 네임택이 붙여져서 구분되어 있는 장면을 생각해보면 된다. 배열처럼 랜덤한 값들이 아니라, 의미하는 바가 있는 묶음을 나타낼때 쓴다. 키(key)혹은 property라고 부르는 것이 이름표가 되고, 그에 해당하는 자료,즉 value가 있다. 객체의 모양 객체는 다음과 같이 생겼다. let user = { name: 'chillDev', email: 'bunnyatgym@gmail.com', city: 'Bucheon' } value에는 텍스트, 숫자, 함수, 객체, 배열 등 다양하게 들어갈 수 있다. 객체를 만드는 법 콜론(:)로 키와 값을 구분한다. 쉼표(,)로 key&val..
[javaScript] 배열 메서드 정리 & 배열의 반복문과 복사 배열이란 배열은 순서가 있는 값의 묶음을 말한다. 배열은 대괄화를 이용해서 만들며, 대괄호 내부의 순서(index)로 조회할 수 있다. 이때 index에 해당되는 value를 배열에서만 특화적으로 요소,혹은 원소(element)라고 부르기도 한다. 배열의 모양 배열은 다음과 같이 생겼다. let myArray = [32,45,33,52,12]; 요소는 예시처럼 숫자가 아니라, 문자,객체,배열 등 다양한 형태가 모두가능하다. 배열을 만드는 법 대괄호(square bracket)을 이용해서 만든다. 각각의 원소는 쉼표로 구분해준다. 배열을 조회하는 법 배열이름[index] let myNumber = [12,33,24,35,22] myNumber[1] //33 각각의 요소에 0부터 순서대로 매겨지는 index..
[javaScript] 과제로 얻은 여러가지 깨달음 정리 본 글은 코드스테이츠 프론트앤드 부트캠프의 koans 페어 프로그래밍을 하면서 기존에 알고 있던 사실에 추가로 알게된 사실들 + 까먹기 쉬운 사실들 위주로 정리하였다. 몇몇은 자료들을 찾아서 덧붙이기도 했다. 시간이 허락할 때 하나씩 주제별 글에 붙여넣거나, 따로 새로운 글을 작성하는 것..이 목표...이긴하다..🥴 1. 자바스크립트의 이상한 현상들만 모아놓은 저장소가 있다. wtfjs(what the f*ck javaScript)의 약자로, 예상치 못한 띠용! 스러운 자바스크립트 현상들을 모아 놓고, 왜 그런지 해석해보는 저장소가 있다. 재미로 보고, 되도록 값을 정확하게 예측할 수 있는 방향으로 사용하는 걸 지향해야한다. 2. 자바스크립트 호이스팅 호이스팅 : 변수의 선언과 초기화를 분리한 후, 선언..
[javaScript] spread와 rest, 그리고 구조분해할당 🧠자바스크립트가 획기적으로 편리해진 ES6 2015년에 출시된 ES6(ECMA Script6)에선 자바스크립트의 가독성과 유지보수성을 획기적으로 향상할 수 있는 문법이 많이 추가되었다. let, const, 템플릿 리터럴, 그리고 spread와 rest까지 모두 ES6버전에서 추가된 것들이라고 한다. ✂️Spread : '...array'로 배열을 푼다. 주로 배열을 풀어서 인자로 전달하거나, 배열을 풀어서 각각의 요소로 넣을 때에 사용한다. function sum(x, y, z) { return x + y + z; } const numbers = [1, 2, 3]; sum(...numbers) // 1+2+3 = 6 리턴 🧶Rest: '...parameter'로 배열로 묶는다. 파라미터를 배열의 형태로..
[javaScript] 클로저(closure)란? 어휘적 환경(lexcial environment)이란? 📦클로저란 클로저 = '함수와 함수가 선언된 어휘적 환경(Lexcial Environment)의 조합' 이 말을 완벽하게 이해하기 위해서는 자바스크립트가 어떻게 변수의 유효범위를 지정하는지(Lexical scoping)를 먼저 이해해야 한다. 👀어휘적 범위 지정 (Lexical Scoping) 사실 '어휘적 범위 지정'이란 말 자체가 굉장히 뭉뚱그려 말하는 추상적인 느낌을 주는데, 그게 맞다. 이는 '어휘적 범위 지정'이라는게 'a의 경우 b가 된다.' 식의 정형화된 규칙이 아니라, 일종의 자바스크립트가 그때그때 변수를 읽는 방식을 퉁쳐서 부르는 표현이기 때문이다. 어휘적 범위 지정(lexical scoping)의 "lexical"이란, 변수가 어디에서 사용 가능한지 알기 위해 그 변수가 소스코드 내 어..
[javaScript] 스코프와 let,const,var 🔭스코프(scope)란 함수의 유효범위 scope는 범위를 뜻하며, 사격시 멀리있는 물체를 정확하게 조준하기 위해 달려있는 작은 망원경을 뜻하기도 한다. 컴퓨터 공학과 javaScript 세상에선 '변수의 유효범위'를 뜻한다고 한다. 📦스코프 규칙 1 : 안쪽 스코프는 눈구멍 뚫린 상자 기본적인 스코프의 원칙은 이렇다. 바깥쪽 스코프에사 선언한 변수는 안쪽 스코프에서 사용가능 안쪽 스코프에서 선언한 변수는 바깥쪽 스코프에서 사용 불가능 그러니까 안쪽에 있는 눈구멍 두개가 뽕뽕 뚫린 상자가 있다고 치자. 그 안쪽에선 바깥에 뭐가 있는지 보이겠지만, 반대로 바깥쪽에서 상자를 본다면 뭐가 들어있는건지 모를것이다. 마찬가지로 안쪽 스코프 범위에선 바깥쪽 스코프 범위의 변수가 뭔지 가져와 쓸 수 있지만, 바깥쪽 ..
[javaScript]원시자료형과 참조자료형 🔍원시자료형과 참조자료형 한눈에 비교하기 원시자료형(primitive data type) 참고자료형(reference data type) string, number, bigint, boolean, undefined, symbol, (null) 배열array,객체object,함수function 고정된 저장 공간을 차지하는 데이터 크기가 얼마든지 커질수 있는 데이터 값 자체를 저장 값을 가르키는 주소를 저장, 실제저장 장소는 heap 크기가 정해져있음 주소가 가르키는 heap은 크기가 정해져있지 않음 값 자체를 복사해옴 let a=1; a=b; b=2; a //1 주소를 복사해옴, 가르키는 값은 그대로 let e=[10,20]; let f=e; f[0]=50; e; //[50,20]
[Git]SSH란? SSH Key 만들고 깃헙에 등록하기 📌사용자 정보 입력하기 처음 git을 다운받았다면 사용자 정보를 입력해야 한다. $ git config --global user.name "나의 사용자 이름" $ git config --global user.email "내 이메일 주소" --global 옵션으로 설정하면, 사용자 홈에 저장되므로 git을 설정할 때 처음에 단 한 번만 입력해도 된다. 나중에 github의 사용자 이름이나 이메일을 변경한다면, 이 명령어를 다시 입력해야 한다. 만약 여러 프로젝트를 진행하고 있어서, 프로젝트마다 다른 사용자 이름과 이메일 주소를 사용하고 싶으면 --global 옵션을 빼고 명령을 실행할 수 있다. 📌기본 텍스트 에디터 변경하기 Git에서 커밋 메시지를 기록할 때, 특히 merge commit 확인 메시지가 ..
[Node.js] Node.js와 npm, package.json뜯어보기 🌈 node.js로 파일 열기 아래의 명령어를 실행하면 커맨드창에서 node.js로 자바스크립트 문서를 실행시킬 수 있다. node hello.js 🌈 npm으로 node.js에서 남이 잘 만든 모듈 갖고오기 코드스테이츠 수업자료의 말을 빌리자면, npm(Node Package Manager)은 폰으로 따지자면 일종의 앱스토어이다. 리눅스의 패키지 매니저가 apt, macOS의 패키지 매니저가 brew이듯, node.js 생태계의 패키지 매니저는 npm인 것이다. 📋 package.json, npm 모듈들 신상정보 node.js로 다운받은 모듈들의 종류와 버전등의 정보는 package.json에 남아있다. package.json에 이런 정보들을 남기는 이유는 협업이나, 다른 환경에서 유지보수등을 할때에 ..