본문 바로가기

전체 글77

JavaScript - Object(2) 객체는 다른 데이터 타입(텍스트, 숫자, 배열 등..)처럼 변수에 저장할 수 있다. {}(중괄호)만 사용하면 되는데, 이렇게 {}으로 생긴 모양의 객체를 object literal(객체 리터럴)이라 부른다. hello라는 변수에 빈 객체를 할당해본다면, let hello = {}; 이렇게 할당해 줄 수 있다. 객체에는 순서가 없는 데이터의 모임이다. 반대로 순서가 있는 데이터는 배열이다. let arr = ['고양이', '귀여워', '멍멍이', '좋아']; arr의 요소가 차례대로 추가된 것이고 index는 0부터 시작한다. arr[0]은 '고양이'이고, arr[1]은 '귀여워'이다. 객체는 키(key)-값(value)쌍으로 된 데이터의 모음으로써 순서가 뒤 바뀌어도 아무 상관이 없다. 배열처럼 순서대로.. 2020. 7. 5.
JavaScript - Class 클래스는 객체지향 프로그래밍의 핵심이다. 객체지향 프로그래밍이란, 프로그램을 객체들로 구성하고, 객체들 간에 서로 상호작용하도록 작성하는 방법이다. JavaScript는 객체지향 중심에 있는 언어는 아니지만, 프로그래밍에 있어서 Class, 객체, 객체지향은 항상 중요한 주제이다. "객체지향 프로그래밍"이라는 단어에서 "객체"는 앞서 배웠던 { num:1 }의 데이터 타입을 말하는 것이 아닌, object, 사물을 뜻한다. 하지만, 클래스는 결국 { num: 1 } 처럼 생긴 객체(object)를 잘 설계하기 위한 틀은 맞다. 그런데 이때의 객체는 특정 로직을 갖고 있는 행동(method)과 변경 가능한 상태(멤버 변수)를 가진다. 원하는 구조의 객체 틀을 짜놓고, 비슷한 모양의 객체를 공장처럼 찍어낼 .. 2020. 7. 5.
JavaScript - Scope JavaScript에서 scope란, '변수가 어디까지 쓰일 수 있는지'의 범위를 의미한다. (주의. 문법 아님!) ***is not defined라는 에러를 한 번이라도 경험했을 수 있었을 텐데, 이 에러는 변수가 아직 선언되지 않았다는 뜻이다. 변수를 선언했는데도 에러를 경험했다면, 변수를 선언한 영역에(block에) 접근할 수가 없어서 컴퓨터가 변수가 선언되었다는 사실을 알지 못해서 그랬을 것이다. 그래서 변수가 선언되지 않았다는 오류 메시지를 출력하게 되는 것이다. 어떤 변수는 여기저기서 쓸 수 있는 반면에, 어떤 변수는 특정 함수 내에서만 쓸 수 있다. 이런 개념이 바로 scope이다. Block scope를 알기 전에 먼저 알아야 할 개념은 block이다. block이란, 중괄호({}, cur.. 2020. 7. 4.
JavaScript - Object 객체는 {}(중괄호)로 감싸져 있고, 클론으로 구분된 이름/값 쌍들이 쉼표로 분리된 목록의 형태이다. 다시 말해, 객체는 이름과 값으로 구성된 프로퍼티들의 집합이라 할 수 있다. 여기서 주의할 점은 프로퍼티 이름이 중복되어선 안된다. 객체의 예) let plan1 = { name: "Basic", price: 3.99, space: 100, transfer: 1000, pages: 10 }; 위의 규칙을 지켜 객체를 만들 수 있다. property 이름은 중복될 수 없다. property 이름과 property값 사이에 :(콜론)으로 구분한다. property를 추가할 때는 ,(쉼표)를 붙여준다. property값에는 어느 type이나 가능하다.(string, number, array, object, f.. 2020. 7. 4.
JavaScript - Number 수학 계산을 위해서는 JavaScript에서 제공하는 Math 객체를 사용해야 한다. 절댓값 구하기, sin, cos, 제곱근 등등, Math 객체를 사용한다. 만약 반올림을 해야 한다면 console.log(Math.round(2.5)); console.log(Math.round(2.49)); console.log(Math.round(2)); console.log(Math.round(2.82)); 이런 식으로 써줄 수 있다. 반올림이나 올림, 내림 등을 써야 하는 경우는 앱 평가 등이 있을 것이다. (올림은 round대신 ceil을 쓰면 되고 내림은 floor을 쓰면 된다.) Math 뿐만 아니라 랜덤 함수를 이용해 랜덤 숫자도 쉽게 구할 수 있다. 원래라면 개발자가 랜덤 숫자를 구할 수 있는 기능을 .. 2020. 7. 4.
JavaScript - 날짜와 시간 1. 날짜와 시간(Date) 프런트엔드 개발할 때, 날짜와 시간을 다루는 경우가 많다. 회원가입을 한 날짜와 시간, 글을 작성한 시간 휴대폰의 현재 시간 등.. 날짜와 시간을 저장하고 보여줄 때 날짜 객체를 사용한다. 날짜 객체를 호출하면 쉽게 시간과 날짜를 얻을 수 있다. 날짜 객체를 생성할 때는 new 연산자 다음에 Date 생성자를 쓴다. var rightNow = new Date(); console.log(rightNow); 이렇게 코드를 작성할 경우 console.log를 찍어보면, 2019-02-18T00:45:06.562Z 이러한 값이 나온다. 단, 브라우저마다 표현하는 법이 조금씩은 다르다. new Date()로 반환된 표현은 사람이 읽기 좋은 표현일 뿐, 실제로 코딩할 때는 new Dat.. 2020. 6. 22.

티스토리툴바