목록전체 글 (134)
코로 넘어져도 헤딩만 하면 그만
구조분해 할당에 대한 개념이 계속 헷갈렸습니다. 자주 쓰이지 않는 것 같아서 흐린 눈을 뜨고 넘기고 있었는데, 그래도 언제까지나 이럴 순 없다는 생각에 한번 파볼 생각입니다. 우선 정의를 살펴보겠습니다. 구조분해 할당이란? - spread 문법을 이용하여 값을 해체한 후, 개별값을 변수에 새로 할당하는 표현식을 말한다. - let, const와 함께 쓰여야 오류를 막을 수 있다. spread 문법이라? 그렇다면 ...을 사용하는 문법을 말하겠네요. [1, 2, 3] 같은 배열이 있을 때, ...[1, 2, 3]을 쓰면 결과가 1, 2, 3 이렇게 배열을 해체해주는 식으로 쓰입니다. 그렇다면 이걸 사용해서 개별값을 변수에 새로 할당한다는 뜻일까요. HOW...? mdn에 나온 예시를 잠시 살펴봅기로 합니다..
스코프, 클로저 부분에 대해 얼추 이해를 했다고 생각했습니다. 하지만 주말에 복습하면서 다시 보니 헷갈리는 부분들이 있어서 개념부터 다시 찬찬하게 살펴보고 이미 한번 풀었던(몇 개는 틀렸던ㅋㅋ)퀴즈를 풀어보았습니다. 스코프와 클로저뿐만이 아니라 JS내부에서 쓰이는 함수, 매개변수의 흐름 자체에 대한 깊은 학습이 필요해 보였습니다. 무엇보다 더 어려운 개념들 배우다가 돌아오니 당시 따라가는 데에 급급하여 보이지 않던 부분들이 새롭게 보이는 장점이 있었어요. 가령 아래와 같은 문제의 결과가 왜 달라지는지. ... 함수 get 내부에 매개변수로 x가 존재하느냐, 아니냐에 따라서 값이 바뀌죠. 외부의 전역변수 x를 끌어올 것이냐, 아니면 매개변수로 들어오는 x를 사용할 것이냐... let x = 30; func..
class Grub { constructor(age, color, food, eat) { this.age = 0; this.color = "pink"; this.food = "jelly"; } eat() { return `Mmmmmmmmm jelly`; } //메소드는 constructor {} 안에 쓰지 않도록 주의할 것. } //아래가 정석 레퍼런스. constructor 내부에만 상세 요소를 넣어준 걸 볼 수 있다. //이게 더 재활용성이 높은 코드 class Grub { constructor(age = 0, color = 'pink', food = 'jelly') { this.age = age; this.color = color; this.food = food; } eat() { return `M..
앞에서 클래스를 배웠으니, 이제 이것을 적극 활용한다. function Person(first, last, age, gender, interests) { this.name = { first, last }; this.age = age; this.gender = gender; this.interests = interests; }; //ES5 문법으로 작성됨, 아래는 ES6 문법으로 똑같이 작성한 결과물이다. class Person { //class를 서서 명시해주고 constructor(first, last, age, gender, interests) { //constructor이 생겼다. this.name = { first, last }; this.age = age; this.gender = gender;..
3. 거듭제곱 여부 확인하기 문제: 수를 입력받아 2의 거듭제곱인지 여부를 리턴해야 합니다. boolean 타입을 리턴해야 합니다. 반복문(while)문을 사용해야 합니다. 2의 0승은 1입니다. Number.isInteger, Math.log2, Math.log 사용은 금지됩니다. function powerOfTwo(num) { if (num === 1) { return true; } //1은 2의 0승이니까... if (num % 2) { return false; } //짝수이면 이 조건문을 실행하지 말되 홀수면 false를 리턴. let powered = 2; while (powered < num) { powered = powered * 2; } //초기값 2로 두고 2를 계속 곱하다가 같아지면 t..
시간이 난 김에 생소한 터미널 명령어들과, git 명령어들을 한 포스팅으로 모아보기로 했다. CLI를 쓰면, GUI로 해오던 과정을 모두 터미널에서 해결할 수 있다. CLI, GUI 두 가지 인터페이스로 하나의 동일한 컴퓨터를 다룰 수 있는 것이다. CLI : Command Line Interface 커맨드 라인 인터페이스 Prompt프롬프트: 키보드의 입력을 확인하고 편집할 수 있는 한 줄의 공간 기초 터미널 명령어 cd //폴더 내부로 진입하기 touch //파일 생성하기(폴더X) pwd //print working directory. 현재 폴더가 위치한 경로를 알아보기 mkdir //새 폴더 생성 ls //특정 폴더 내에 포함된 파일 혹은 폴더 확인 ls -a //숨김 폴더나 파일까지 포함하는 al..
자바 스크립트는 프로토타입 기반 언어다. (사실 이 개념에 관련된 포스팅으로 아주 좋은 국내 자료가 있어서 하단 첨부했으니 일회독 이상을 권한다. 자바 스크립트 언어의 기원과 깊은 관련이 있다.) 어쨌거나 자바 스크립트는 '프로토타입 Prototype' 이라는 이름을 가진 슬롯을 통해 객체를 상속한다. 이는 JS에 존재하는 모든 객체들이 속성과 메소드를 상속받기 위한 수단으로 '프로토타입 객체'를 택한다는 뜻이다. 좀더 풀어 말하자면 '프로토타입'이라는 속성에는, 자식에게 상속되는 요소들이 정의되어 있다. 모든 객체는 프로토타입을 갖고 있으며, 모든 프로토타입은 '생성자 함수'와 연결되어 있다. prototype도 하나의 객체이며 '프로토타입 체인'을 통해 상속하고자 하는 속성과 메소드를 담아두는 버킷으..
이제 클래스와 인스턴스에 대한 지식에서 조금 더 나아가보자. 다소 추상적이라고 느껴질지도 모르겠지만, 방법론에 대한 개념적인 부분을 잠시 짚고 가야한다. 딱 떨어지는 개념이 아니기에 어려우나 여러 번 곱씹고 예시를 찾아보면 조금씩 이해되는 것을 느낄 수 있다. 그리고 객체 지향 프로그래밍의 중요성도 깨달을 수 있을 것이다. 초기의 언어들(C, 포트란 등)은 객체 지향 개념이 부족한 '절차적 언어'(절차적 프로그래밍)에 속했다. 절차적인 언어는 Procedure를 사용하여 작성하는 프로그래밍 스타일로, 순차적인 처리들의 유기적 조합을 의미한다. 이 방식은 처음에 구조적인 프로그래밍이 가능케 했다. 하지만 점차 프로그래밍의 규모가 커지면서 코드의 순서가 바뀔 때 오류가 발생하고, 부분을 잘못 건드렸는데 전체..