전체 글
-
[#혼공챌린지] 혼자 공부하는 자바스크립트 6주차 미션카테고리 없음 2021. 8. 16. 19:58
공부내용 정리 Chapter 09: 클래스 Chapter 10: 리액트 기본 미션 클래스, 인스턴스, 생성자, 추상화가 무엇인지 설명하기 클래스 객체를 안전하고 효율적으로 만들 수 있는 방법 중 하나. 인스턴스 클래스를 기반으로 만든 객체 생성자 클래스를 기반으로 인스턴스를 생성할 때 처음 호출되는 메소드 추상화 수많은 정보를 갖고 있는 현실의 객체를 컴퓨터에 데이터화시키기 위해, 필요한 정보만을 사용해 객체를 표현하는 것. 선택미션 p.400 확인문제 2번 정리해서 인증샷 여러가지 프로그램에 들어있는 객체를 생각해보세요. 예를들어 배달 어플리케이션이라면 가게, 메뉴, 주문 내역, 리뷰, 회원 등의 객체를 생각해볼 수 있습니다. 또 이러한 객체의 속성을 생각해볼 수도 있습니다. 가게 객체라면 이름, 주소..
-
혼자 공부하는 자바스크립트 10장 - 리액트자바스크립트/혼자 공부하는 자바스크립트 2021. 8. 16. 19:33
리액트 리액트는 자바스크립트 라이브러리로, 사용자 인터페이스(UI)를 쉽게 구성할 수 있도록 도와준다. 리액트 라이브러리를 사용하면 대규모 프론트엔드 웹 앱을 체계적으로 개발할 수 있으며, 리액트 네이티브를 활용해 스마트폰에서도 빠른 속도로 작동하는 애플리케이션을 만들 수 있다. 리액트 라이브러리 사용 준비하기 가장 기본적인 방법은 HTML에서 react.development.js, react-dom.development.js, babel.min.js 세 개의 자바스크립트를 읽어들이는 것이다. 앞의 두개는 리액트를 사용하기 위해 필요하고, babel은 리액트 코드를 쉽게 작성할 수 있게 해준다. 리액트 라이브러리는 단순한 자바스크립트가 아니라, 리액트를 위해서 개발된 자바스크립트 확장 문법(JSX)을 사..
-
혼자 공부하는 자바스크립트 9장 - 클래스자바스크립트/혼자 공부하는 자바스크립트 2021. 8. 16. 19:31
클래스의 기본 기능 C를 제외한 다양한 프로그래밍 언어는, 객체를 우선적으로 생각해서 프로그램을 만드는 객체 지향 프로그래밍 언어가 많다. 클래스라는 문법은 객체를 효율적이고 안전하게 만들어 객체 지향 패러다임을 쉽게 프로그래밍에 적용할 수 있도록 돕는다. 추상화 복잡한 자료, 모듈, 시스템 등으로부터 핵심적인 개념과 기능을 간추려내는 것 대부분의 프로그램은 "우리가 어떤 데이터를 활욯하는가?" 라는 생각으로 부터 시작된다. 현실의 객체는 데이터가 될 수 있는 수많은 속성을 갖고 있기에, 현실의 모든 정보를 컴퓨터 내부에 입력하는 것은 불가능에 가깝다. 프로그램을 만들 땐 필요한 요소만 사용해 객체를 표현하는데, 이를 추상화라고 한다. 학생 성적 관리 프로그램을 만든다고 치자. 우선 학생이라는 객체가 필..
-
[#혼공챌린지] 혼자 공부하는 자바스크립트 5주차 미션자바스크립트/혼공챌린지 2021. 8. 8. 23:55
공부내용 정리 Chapter 07: 문서 객체 모델 Chapter 08: 예외 처리 기본 미션 p.315의 을 실행한 후 출력되는 고양이 이미지 인증샷 http://placekitten.com/너비/높이의 형태로 URL을 입력하면 적절한 크기의 고양이 이미지를 얻을 수 있는데, img 태그의 src 속성과 결합해 고양이 이미지를 출력할 수 있다. 인덱스는 0부터 시작하므로, 만일 1을 더해주지 않는다면 첫번째 이미지는 너비가 0이 되어 정보를 표출하지 못하게 될 것이다. 너무 귀엽다... const heigth = (index + 1) * 100을 추가하고, src를 http://placekitten.com/${width}/${height};로 설정해보았다. 너무 귀엽다...(2) 선택미션 p.352 누..
-
혼자 공부하는 자바스크립트 8장 - 예외 처리자바스크립트/혼자 공부하는 자바스크립트 2021. 8. 8. 23:53
구문 오류와 예외 자바스크립트 코드 작성 시 오류는 두 가지가 있다: 구문 오류syntax error: 코드가 실행조차 되지 않는 오류 예외expeption: 코드 실행 중간에 발생하는 오류 예외를 처리하는 것을 예외 처리라고 한다. 오류의 종류 프로그래밍 언어의 오류에는 크게 2가지 종류가 있다: 1) 프로그램 실행 전에 발생하는 오류, 2) 프로그램 실행 중에 발생하는 오류. 1)을 구문 오류라고 부르고, 2)를 예외 혹은 런타임 오류라고 구분하여 부른다. 구문 오류 괄호의 짝을 맞추지 않거나, 문자열을 열었는데 닫지 않았거나 등의 상황에서 발생한다. 이때 웹 브라우저는 코드를 분석할 수 없으므로 실행되지 않는다. 자바스크립트는 구문 오류 발생시 Uncaught SyntaxError 문을 띄운다. 오..
-
혼자 공부하는 자바스크립트 7장 - 문서 객체 모델자바스크립트/혼자 공부하는 자바스크립트 2021. 8. 8. 23:51
문서 객체 모델 DOM, Document Object Model: 문서 객체를 조합해서 만든 전체적인 형태 HTML 요소를 자바스크립트에서는 문서 객체라고 부른다. 즉, 문서 객체를 조작한다는 말은 HTML 요소를 조작한다는 의미이다. DOMContentLoaded 이벤트 문서 객체를 조작할 때는 DOMContentLoaded 이벤트를 사용한다. 이때, 오탈자를 입력해도 오류가 발생하지 않으므로 주의한다. document.addEventListner("DOMContentLoaded", () => { }) HTML 문서에서, 웹 브라우저가 문서 객체를 모두 읽고 나면(즉, DOMContentLoaded 상태가 되면), 콜백함수를 호출해 문서 body에 DOMContentLoaded 이벤트 발생 이라는 내용..
-
[#혼공챌린지] 혼자 공부하는 자바스크립트 4주차 미션자바스크립트/혼공챌린지 2021. 8. 1. 19:36
공부내용 정리 Chapter 05: 함수 Chapter 06: 객체 기본 미션 202쪽의 예제를 실행하여 2021년이 윤년인지 확인하는 결과 인증샷 윤년의 특징: 4로 나누어 떨어지는 해는 윤년이다. 하지만 100으로 나누어 떨어지는 해는 윤년이 아니다. 하지만 400으로 나누어 떨어지는 해는 윤년이다. 이러한 윤년의 특징을 isLeapYear()라는 함수로 구현한다. 숫자인 년도를 매개변수로 입력했을 때 윤년이면 true, 윤년이 아니면 false를 리턴한다. true, false를 리턴하는 함수는 보통 isOO()라는 이름으로 만든다. 내가 짠 식 const isLeapYear = (year) => { if (year % 4 === 0 && (year % 100 !== 0 || year % 400 =..
-
혼자 공부하는 자바스크립트 6장 - 객체자바스크립트/혼자 공부하는 자바스크립트 2021. 8. 1. 18:03
객체 이름name과 값value으로 구성된 속성property을 가진 자바스크립트의 기본 데이터 타입 자바스크립트에서 여러 자료를 다룰 때는 객체를 사용한다. 여러 자료를 다룰 수 있는 배열 역시 객체이다. typeof []를 실행하면 object를 출력한다. 객체는 중괄호{}로 생성하며, 키: 값의 형태의 자료를 ,로 연결해서 입력한다. const person = { name: "Bob", age: 32, handsome: true, interests: ['music', 'skiing'], bio: function() { alert(`${this.name} is ${this. age} years old. He likes ${this.interests[0]} and ${this.interests[1]}...