no image
[Javascript] 시간과 관련된 유틸함수를 알아보자⏱️
안녕하세요! 오늘은 자바스크립트에서 사용이 가능한 시간과 관련된 유틸함수를 정리해보겠습니다! 1. Moment객체로 몇분전, 몇시간전, 몇일전 표현하기. moment 객체는 JavaScript에서 날짜와 시간을 다루기 위해 사용되는 외부 라이브러리입니다. moment를 사용하면 날짜와 시간을 문자열로 파싱하거나, 현재 날짜와 시간을 가져오는 것부터 특정 날짜와 시간 간의 차이를 계산하고, 날짜와 시간을 서식화하여 출력하는 등의 작업을 간편하게 수행할 수 있습니다. 아래 함수는 moment 를 이용하여 주어진 날짜 데이터와 현재 날짜와 시간 사이의 차이를 계산하여 반환합니다. export const getData = (data) => { // 입력된 데이터(data)가 비어있거나(null 또는 undefi..
2023.07.24
no image
[JavaScript] ReferenceError: '' is not defined 해결방법
* Uncaught ReferenceError: address2 is not defined at HTMLDocument. script 태그가 제대로 실행되지 않았기 때문에 발생한 문제이다. 스크립트 실행에 있어서 변수를 제대로 닫아주지 않았기 때문! 크롬 개발자 도구에서 문제의 코드 부분을 알려줬다. 감싸주니 오류해결!
2022.04.16
no image
[JavaScript] 19장 프로토 타입 (2)
19.7 프로토타입 체인 // 예제 19-29 function Person(name) { this.name = name; } // 프로토타일 메서드 Person.prototype.sayHello = function () { console.log(`Hi! My name is ${this.name}`); }; const me = new Person('Lee'); // hasOwnProperty는 object.prototype의 메서드다. console.log(me.hasOwnProperty('name')); // true - Person 생성자 함수에 의해 생성된 me 객체는 Object.prototype의 메서드인 hasOwnProperty를 호출할 수 있다. - 이것은 me 객체가 Object.proto..
2022.03.31
no image
[JavaScript] 19장 프로토 타입 (1)
- 자바스크립트는 클래스 기반 객체지향 프로그래밍 언어보다 효율적, 더 강력한 객체지향 프로그래밍 능력을 지니고 있는 프로토타입 기반의 객체지향 프로그래밍 언어. 19.1 객체지향 프로그래밍 - 전통적인 명령형 프로그래밍의 절차 지향적 관점에서 벗어나 객체의 집합으로 표현하려는 프로그래밍 패러다임. • 속성 : 실세계의 실체(사물이나 개념)를 인식하는 철학적 사고를 프로그래밍에 접목하려는 시도에서 시작. 특징이나 성질 나타냄. • 추상화 : 다양한 속성 중에서 프로그램에 필요한 속성만 간추려 내어 표현하는 것. • 객체 : 속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적인 자료구조 // 예제 19-02 const circle = {radius: 5, // 반지름 // 원의 지름: 2r getDi..
2022.03.31
no image
[JavaScript] 18장 함수와 일급 객체
18.1 일급 객체 - 아래의 조건을 만족하는 객체를 일급 객체이다. 1. 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. 2. 변수나 자료구조(객체, 배열 등)에 저장할 수 있다. 3. 함수의 매개변수에 전달할 수 있다. 4. 함수의 반환 값으로 사용할 수 있다. // 예제 18-01 // 1. 함수는 무명의 리터럴로 생성할 수 있다. // 2. 함수는 변수에 저장할 수 있다. // 런타임(할당 단계)에 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당된다. const increase = function (num) { return ++num; }; const decrease = function (num) { return --num; }; // 2. 함수는 객체에 저장할 수 있다..
2022.03.31
no image
[JavaScript] 17장 생성자 함수에 의한 객체 생성
17.1 Object 생성자 함수 - new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환. - 빈 객체를 생성한 이후 프로퍼티 또는 메서드를 추가하여 객체를 완성할 수 있음. • 생성자 함수 : new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수. • 인스턴스 : 생성자 함수에 의해 생성된 객체. 17.2 생성자 함수 17.2.1 객체 리터럴에 의한 객체 생성 방식의 문제점 - 객체 리터럴에 의한 객체 생성 방식은 직관적이고 간편. - 하지만 동일한 프로퍼티를 갖는 객체를 여러 개 생성해야 하는 경우에 비효율적. - 객체는 프로퍼티로 객체 고유의 상태를 표현. 메서드로 상태 데이터인 프로퍼티를 참조하고 조작하는 동작 표현. - 따라서 프로퍼티는 객체마다 프로퍼티 ..
2022.03.31
no image
[JavaScript] 16장 프로퍼티 어트리뷰트
16.1 내부 슬롯과 내부 메서드 - 내부 슬롯/내부 메서드 : 자바스크립트 엔진 구현 알고리즘을 설명하기 위한 ECMAScript 사양에서 사용하는 의사 프로퍼티 / 의사 메서드. - 이중 대괄호 ([[ ... ]])로 감싼 이름들이다. - 자바스크립트 엔진의 내부 로직이므로 직접 접근하거나 호출할 수 있는 방법은 제공하지 않음. 일부에 한하여 접근할 수 있는 수단 제공. 16.2 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 - 자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티 어트리뷰트를 기본값으로 자동 정의함. * 프로퍼티 상태 : 프로퍼티의 값, 값의 갱신 가능 여부, 열거 가능 여부, 재정의 가능 여부 - Object.getOwnPropertyDescriptor 메서드를 사용하여 간접적으로 확..
2022.03.31
no image
[JavaScript] 15장 let, const 키워드와 블록 레벨 스코프
15.1 var 키워드로 선언한 변수의 문제점 15.1.1 변수 중복 선언 허용 - var 키워드 변수를 중복 선언하면 초기화 문에 따라 다르게 동작함. → 초기화 문이 있을 경우 : var 키워드가 없는 것처럼 동작함. → 초기화 문이 없을 경우 : 선언문 무시. 에러는 발생하지 않는다. - 동일한 이름의 변수가 이미 선언된 줄 모르고 중복 선언하며 값을 할당했다면 값이 변경되는 부작용 발생. 15.1.2 함수 레벨 스코프 - var 키워드로 선언한 변수는 함수 코드 블록만 지역 스코프로 인정. - for문의 변수 선언문에서도 전역변수가 됨. - 함수 레벨 스코프는 전역 변수를 남발할 가능성 높임. 15.1.3 변수 호이스팅 - var 키워드로 선언한 변수는 변수 호이스팅에 의해 선두로 끌어올려진 것처..
2022.03.31
no image
[JavaScript] 14장 전역 변수의 문제점
14.1 변수의 생명 주기 14.1.1 지역 변수의 생명 주기 - 지역 변수의 생명 주기는 함수의 생명 주기와 일치한다. 14.1.2 전역 변수의 생명 주기 - 함수와 달리 전역 코드는 명시적 호출 없이 실행. 하지만 반환 문을 사용할 수 없으므로 마지막 문이 실행되어 더 이상 실행할 문이 없을 때 종료. - var 키워드로 선언한 전역 변수는 전역 객체의 프로퍼티가 됨/ 전역 변수의 생명주기가 전역 객체의 생명 주기와 일치. 14.2 전역 변수의 문제점 암묵적 결합 - 전역 변수의 선언 의도는 코드 어디서든 참조하고 할당할 수 있는 변수를 사용하겠다는 것 (암묵적 결합 허용). 긴 생명 주기 - 전역 변수는 생명 주기가 길고 지역 변수는 그보다 훨씬 짧다. 이는 지역변수는 상태 변경에 의한 오류가 발생..
2022.03.30