JS/JavaScript 강의67 [JS] 65. Class 상속 in ES6 안녕하세요. 박기린 입니다. ES6의 class 방식으로 inheritance(상속)을 구현하는 방법에 대해 알아보겠습니다. Inheritance between Classes in ES6 class PersonCl { constructor(fullName, birthYear) { this.fullName = fullName; this.birthYear = birthYear; } calcAge() { console.log(2023 - this.birthYear ); } static hey() { console.log('Hey there'); console.log(this); } }; 우선 위와 같은 PersonCl class가 있다고 가정을 합니다. 사람의 정보를 담은 클래스인데, 이 클래스를 상속받아서 .. 2023. 2. 1. [JS] 64. Static Methods in Class 안녕하세요. 박기린 입니다. Static Methods Array.from(), Number.parseFloat()과 같이 프로토타입에서는 쓸 수 없고, Class 원형 그 자체에서만 쓸 수 있는 내장함수들과 같이, 프로토타입으로 상속이 되지 않는 메소드들을 Static Methods라고 부릅니다. +) 프로토타입에 대한 설명이 담긴 글 : https://arnopark.tistory.com/574 ES6 방식으로 구현하기 +) ES6 Class에 대한 설명이 담긴 글 : https://arnopark.tistory.com/575 class PersonCl { constructor(fullName, birthYear) { this.fullName = fullName; this.birthYear = bir.. 2023. 1. 31. [JS] 63. Setter와 Getter 안녕하세요. 박기린 입니다. Accessor Properties JS의 모든 Object는 getter와 setter를 가질 수 있습니다. 이 둘은 함수이자, Object 내부의 값을 획득하거나 새로 지정하는 함수가 담긴 property입니다. 이를 Accessor property(접근자 프로퍼티-속성)라고 부릅니다. Get and Set const account = { owner: 'Jonas', movements: [200, 530, 120, 300], get latest() { return this.movements.slice(-1).pop(); }, set latest(mov) { this.movements.push(mov); }, }; getter와 setter는 object 내에서 'get',.. 2023. 1. 30. [JS] 62. ES6 Class 안녕하세요. 박기린 입니다. 이전에 생성자 함수와 new 연산자를 이용해서 class를 선언하는 방법에 대해 알아봤습니다. 이번에는, 기존의 JS 프로토타입 방식을 사용하지만 다른 언어의 Class와 유사하게 코드를 작성할 수 있는 방법에 대해 알아보겠습니다. ES6 Class 이 방법은 ES6 버전 JS에서 업데이트된 방식으로, class라는 예약어를 이용해서 클래스를 선언하는 방식입니다. class를 선언하는 데에는 class expression과 class declaration 두 가지 방법이 있습니다. class expression const PersonCl = class { constructor(firstName, birthYear) { this.firstName = firstName; this.. 2023. 1. 13. [JS] 61. 생성자 함수와 new 연산자/프로토타입 상속과 체인 안녕하세요. 박기린 입니다. 이번엔 객체 지향 프로그래밍(OOP - Object Oriented Programming)의 class를 생성하는 방법에 대해 알아보겠습니다. 생성자 함수와 new 연산자 자바스크립트에서는 생성자 함수와 new 연산자를 이용해서 class를 생성할 수 있습니다. 이 방식은 JavaScript의 구식 방식으로, 앞으로 소개해드릴 모든 자바스크립트 class 생성 방법의 근간이 되는 방식입니다. 다른 언어와는 다른 부분이 많다보니 헷갈릴 수도 있습니다. const Person = function(firstName, birthYear) { // Instance properties this.firstName = firstName; this.birthYear = birthYear; }.. 2023. 1. 11. [JS] 60. 타이머 : setTimeout & setInterval 안녕하세요. 박기린 입니다. 이번에는 JS에서 타이머를 설정하는 방법에 대해 알아보겠습니다. setTimeout() const ingredients = ['olives', 'spinach']; const pizzaTimer = setTimeout( (ing1, ing2) => console.log(`Here is your pizza with ${ing1} and ${ing2} 🍕`), 3000, ...ingredients ); setTimeout( 콜백함수, 밀리초, 콜백함수에 들어올 인수들 ) setTimeout()은 특정 시간이 지나면 콜백함수를 불러오는 JS 내장함수 입니다. 이때, 단 한 번만 콜백함수를 불러옵니다. 실행한 후 3초를 기다리면 함수가 실행됨을 확인할 수 있습니다. clearTime.. 2023. 1. 10. [JS] 59. Date 객체를 이용해서 날짜 계산하기 안녕하세요. 박기린 입니다. 이전에 쓴 Date 객체 설명글에 이어서, 실제 앱에서 사용할 수 있는 날짜 계산 방식에 대해 설명해보겠습니다. 타임스탬프를 이용해서 날짜 계산하기 const future = new Date(2037, 10, 19, 15, 23); console.log(+future); Date 객체를 +연산자를 이용해서 Number 타입으로 coercion하면, 타임 스탬프 값으로 변환됩니다. (타임 스탬프에 관한 설명이 담긴 글 : https://arnopark.tistory.com/569) 이 타임 스탬프를 이용해서 두 날짜 간의 간격을 계산할 수 있습니다. const calcDaysPassed = (date1, date2) => Math.trunc(date2 - date1) / (10.. 2023. 1. 4. [JS] 58. 날짜 만들기 - Date 안녕하세요. 박기린 입니다. 이번에는 Date 객체를 이용해서 JavaScript에서 날짜를 구현하는 방법에 대해 알아보겠습니다. 현재 시각 const now = new Date(); console.log(now); // 현재 날짜를 출력 new Date() Date() 생성자 함수를 이용해서 날짜를 구현할 수 있습니다. 현재 시각을 나타내고 싶을 때는 아무것도 인수로 넘기지 않고 Date() 생성자 함수만 선언해주면 됩니다. Date()의 인수 - String console.log(new Date('Aug 02 2020 18:05:41')); console.log(new Date('December 24, 2015')); Date() 생성자는 구문 분석 기능을 가지고 있습니다. 특정 시간이 입력된 Str.. 2023. 1. 3. [JS] 57. Bigint 타입 안녕하세요. 박기린 입니다. 이번에는 Bigint에 대해 설명을 하겠습니다. Bigint Bigint는 ES2020부터 도입된 데이터 타입입니다. Number타입처럼 숫자를 저장하는 데이터 타입이지만, Number의 숫자 저장 한도를 넘은 수까지 저장할 수 있는 데이터 타입입니다. 그래서 말 그대로 Big - integer라고 볼 수 있습니다. Number의 한계 900719925470991가 Number가 나타낼 수있는 최대 숫자 입니다. console.log(2 ** 53 - 1); // 900719925470991 console.log(Number.MAX_SAFE_INTEGER); // 900719925470991 console.log(2 ** 53 + 1); // 900719925470992 2023. 1. 2. 이전 1 2 3 4 ··· 8 다음
