전체 글(105)
-
[JS] JavaScript 객체와 this 키워드
강의: [edwith 부스트코스] 웹 프로그래밍 챕터 4, 웹 앱 개발: 예약서비스 2/4 학습일: 2020년 6월 17일 1. 객체지향 JavaScript 구현 - FE 객체 리터럴과 this 객체지향 프로그래밍과 JavaScript 객체 프로그래밍을 배우다보면 객체지향 프로그래밍이란 용어를 자주 접하게 될 것이다. 객체지향 프로그래밍을 간략하게 설명하면, '객체를 중심으로 속성을 설정하고, 그 속성을 다루는 방식의 프로그래밍 방식'이다. 객체지향 방식으로 프로그래밍을 하면 복잡하게 얽힌 많은 작업들을 일관성 있게 관리할 수 있다. 큰 분류에 따라 객체로 나눈 뒤, 각 객체의 데이터에 맞는 메서드를 입력하고, 객체 사이의 상호작용을 통해 속성에 접근하거나 값을 수정하는 등의 작업에 적합하기 때문이다. ..
2020.06.17 -
[JS] 배열의 함수형 메소드, forEach, map, filter
강의: [edwith 부스트코스] 웹 프로그래밍 챕터 4, 웹 앱 개발: 예약서비스 2/4 학습일: 2020년 6월 16일 0. 챕터 소개 이번 챕터에서는 Back End 부분은 잠시 쉬고, Front End 위주로 학습하게 된다. 핵심 키워드는 아래와 같다. - JQuery - Handlebars - forEach - Map - Filter - 클린 코드 1. 객체지향 JavaScript 구현 - FE JavaScript 배열의 함수형 메소드 Front End에서의 데이터 처리의 중요성 예전과 달리, 데이터 처리는 더 이상 Back End만의 일이 아니다. 이는 Front End에서 데이터 조작을 해야 하는 경우가 많아졌기 때문이다. 특히 SPA(Single Page Application)의 등장이 이..
2020.06.16 -
SQL Join 알아보기 ... 기본 유형 4가지
SQL Join 명령문에 대해 간단하게 설명한 SQL Joins Explained를 번역한 글입니다. SQL Join의 4가지 기본 유형 SQL Join의 가장 기본적인 유형 4가지는 Inner, Left, Right, Full Join입니다. 이 네 유형의 차이를 가장 쉽고 직관적으로 설명하기 위해서, 모든 데이터 모음 간 논리 관계를 보여줄 수 있는 벤 다이어그램을 활용합니다. 다시 한 번 말씀드리지만, 어떤 Join 유형을 사용하든 간에 그 전에 관계형 데이터베이스에 추출한 데이터를 집어넣어줘야 합니다. 데이터를 집어넣는 작업은 직접 하거나, 외부의 자동화된 서비스를 이용하면 됩니다. 데이터베이스에 데이터를 집어넣었다면, 두 개의 데이터 모음인 테이블 A와 B가 있다고 가정해봅시다. 두 테이블은 기..
2020.05.30 -
SQL Join 알아보기 ... Join이란?
SQL Join 명령문에 대해 간단하게 설명한 SQL Joins Explained를 번역한 글입니다. SQL 명령문, Join이 대체 무엇인가요? SQL의 Join은 두 개의 데이터 모음으로부터 데이터를 조합하는 명령문입니다. SQL Join에 대해 자세히 알아보기 전에 SQL이 무엇인지, 왜 Join이란 명령문을 쓰는지 짧게 알아보겠습니다. SQL은 RDBMS의 정보 관리라는 특수한 목적으로 만들어진 프로그래밍 언어입니다. 여기서 핵심은 '관계형'이란 단어입니다. 데이터베이스의 구조가 데이터 모음 사이에 명시적인 관계가 있도록 구성되어 있다는 것을 알려주기 때문입니다. 일반적으로 SQL 명령문을 써서 RDBMS를 다루기 전에, 먼저 RDBMS에 추출한 데이터를 변형, 입력해야 합니다. 관계형 데이터베이..
2020.05.25 -
두더지 잡기 게임 만들기
많다면 많고, 적다면 적었던 JavaScript30 시리즈의 마지막 튜토리얼입니다. 오락실 앞에 약방의 감초처럼 놓여있는 두더지 게임을 간단하게 JavaScript로 구현해봅니다. 튜토리얼 정보 출처: JavaScript30 이름: Day 30 - Whack A Mole 언어: JavaScript 목표: 구멍에서 무작위로 튀어나오는 두더지를 잡는 미니 게임 만들기 진행 기간 2020년 5월 16일 두더지가 나오는 구멍, 나와있는 시간 무작위로 설정하기 우선, 두더지가 튀어나올 구멍이 여럿 필요합니다. 여러 구멍 중 어떤 구멍으로 나올지, 그리고 나와서 얼마 동안 있다가 다시 들어갈 지가 정해져야 하겠죠. 두더지가 튀어나오는 구멍과 튀어나왔다가 들어가는 시간이 일정하면 금방 질리기 때문에, 이 둘을 무작위..
2020.05.17 -
카운트다운 타이머 만들기
튜토리얼 출처: JavaScript30 튜토리얼 이름: Day 29 - Countdown Timer 튜토리얼 분류: JavaScript 튜토리얼 설명: 지정된 시간과 직접 입력한 시간 동안 카운트다운되는 타이머 만들기 진행기간: 2020년 5월 14일 JavaScript를 사용해 현재 시간으로부터 일정 시간 뒤까지 카운트다운을 실행하는 타이머를 만들 수 있다. 사전에 지정한 시간 동안 작동하게 할 수도 있고, 직접 입력한 시간 동안 작동하게 할 수도 있다. 카운트다운 시간 계산하기 우선, 카운트다운 시간을 계산하기 위해 현재 시각과 종료 시각이 필요하다. 아래 timer 함수의 코드를 보자. Date.now( ) 메서드를 통해 현재 시각을 계산하고, 현재 시각에 인자로 넘겨받은 seconds를 더해 종료..
2020.05.15