Headwing

드디어 항해 1주차 미니 프로젝트가 막을 내렸다. 1주차를 해보면서 정말 막막한 점도 많았고 그걸 극복하면서 성취감과 뿌듯함을 느낄 수 있었고 점점 개발자화되어가는 내 자신을 발견했다. 정말 하루하루가 마치 내 인간성을 개발자로 개조해나가는 기분이었다. 그만큼 힘들었지만 보람차기도 했다. 완성된 결과물의 유튜브 링크다. 우리조는 자취생을 위한 레시피를 올리는 게시판을 컨셉으로 했다. 간단한 요리를 올리는 게시판이다보니 5줄 이내로 올리도록 하는 "Five Line Recipe"라는 이름으로 하였다. 내가 초반에 맡은 부분은 로그인/회원가입 페이지를 구현하는 것이었는데 이에 필요한 쿠키와 토큰의 개념을 처음 접하다보니 생소한 점이 많았다. 로그인이 성공하면 쿠키라는 브라우저 임시저장소에 JWT토큰을 저장하..

1. 기본형 데이터와 참조형 데이터 JS Basics #1 - JS 기본형과 참조형 차이점 정리 기본형과 자료형의 차이 자바스크립트의 두가지 타입인 기본형과 자료형의 정의에 대해 알아보고 두 타입간의 차이점이 발생하는 원인에 대해 알아보겠습니다. 자바스크립트 데이터 타입은 크 webclub.tistory.com 자바스크립트 데이터 타입은 크게 두가지인 원시형(Primitive Type)과 참조형(Reference Type)으로 분리된다. 기본(원시)형에는 Number, String, Boolean, null, undefined 가 있으며 ES6 에서는 Symbol 도 추가되었다고 한다. 참조형은 대표적으로 객체(Object)가 있고 그 하위에 배열(Array), 함수(Function), 정규표현식(Reg..

JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 ? 1. null vs undefined 자료형 null 값은 오로지 null 값만 포함하는 별도의 자료형을 만든다. 또한 자바스크립트의 null은 자바스크립트 이외 언어의 null과 성격이 다르다. 다른 언어에선 null을 '존재하지 않는 객체에 대한 참조’나 '널 포인터(null pointer)'를 나타낼 때 사용하지만 자바스크립트에선 null을 ‘존재하지 않는(nothing)’ 값, ‘비어 있는(empty)’ 값, ‘알 수 없는(unknown)’ 값을 나타내는 데 사용합니다. undefined 값도 null 값처럼 자신만의 자료형을 한다. undefined는 '값이 할당되지 않은 상태’를 나타낼 때 사용하며 변수는 선언했지만, 값..

선언적 함수와 익명 함수의 차이에 대한 고찰 선언적 함수와 익명 함수는 본질적으로 같다. 사실 선언적 함수는 함수 자체이고 자료형이라 말하기 어려운데, 자바스크립트에서 선언적 함수를 선언할 시 이를 자료형으로 만들어주기위해 함수의 이름으로 "let 함수이름 = function 함수이름 () {}" 이런식으로 강제로 자료형에다가 할당을 하게 되기 때문이다. 이런 이유로 자바스크립트에서는 함수를 자료형으로 취급할 수 있고, 이러한 이유로 콜백함수역시 존재하게 되는 것이다. 그런데 이렇게 강제로 선언적 함수를 자료형에 할당하기위해서는 웹브라우저가 순서대로 읽는 것이 아니라 자기가 강제로 처리할 것들을 먼저 처리하게 된다. 이것을 변수 호이스팅이라고 한다. 여기에 대해 아주 구체적으로 설명한 블로그 링크를 첨부..

1. 콜백 함수 자바스크립트에서는 함수도 하나의 자료형이므로 매개변수로 전달할 수 있다. 이렇게 매개변수로 전달하는 함수를 콜백 함수라고 한다. 아래의 예제는 콜백함수로 익명함수를 사용했을 때의 코드이다. 2. 콜백 함수를 활용하는 함수 배열이 갖고 있는 메소드 중에서 콜백 함수를 활용하는 메소드는 다음과 같은 형태의 콜백함수를 사용한다. 아래의 경우 콜백 함수의 매개변수를 온전히 입력한 것으로, 때에 따라 필요한 것만 입력하여 사용할 수 있다. 일반적으로는 value만 또는 value와 index만 사용하는 경우가 많다. 다만 사용하고자 하는 것의 위치와 순서에 맞게 입력하여야 한다. function (value, index, array) {} forEach() : forEach() 메소드는 배열이 갖..

1. A부터 B까지 범위를 지정했을 때 범위 안의 숫자를 모두 곱하는 함수 만들기 (p218, 1번) function apple(a, b) { let output = a for (let i = a; i

1. 익명함수 VS. 선언적 함수 익명함수는 말그대로 이름이 없는 함수이다. 따라서 익명함수를 선언하고 사용하기 위해서는 변수에 넣어서 사용하여야 한다. 즉, 함수를 정의시 "function () {}"와 같이 이름이 부여되지 않기 때문에, let 함수 = function () {};"와 같이 변수에 넣어서 호출해야한다. 선언적 함수는 함수를 선언할 때 이름을 붙여주는 함수를 말한다. "function 함수() {}"와 같이 선언하므로 따로 변수에 넣어주지 않고 선언할 때 붙여준 이름으로 호출하면 된다. 둘다 호출하는 방식은 똑같이 "함수()"가 된다. 다시 말하자면 함수 자체의 이름이 있냐 없냐(function 옆에 있는 이름)에 따라 달라지므로 let으로 변수에 넣는 것은 함수를 구분하는데 의미가 없..

1. 배열 (Array) 배열은 여러 개의 변수를 한 번에 선언해 다룰 수 있는 자료형이다. 배열 내부에 들어있는 값을 요소라고 하고, 요소의 순서를 인덱스라고 한다. 배열은 보통 여러개를 갖기 때문에 일반적으로 배열 이름을 복수형으로 짓는다. const numbers = [273, 52, 103, 32] // 배열[인덱스] numbers[0] // 배열 요소 개수 확인하기 numbers.length //4 numbers[numbers.length - 1] // 맨 마지막 요소 출력 // 배열 뒷부분에 요소 추가하기 numbers.push('사과') numbers // [273, 52, 103, 32, '사과'] // 인덱스를 활용해 배열 뒷부분에 요소 추가하기 numbers[numbers.length]..