반응형

JavaScript 38

[JavaScript] 상속(Inheritance), super()

상속(Inheritance) 개념 코드의 재활용성을 높이는 프로그래밍 기법 - 자바스크립트의 정의 코드의 재활용성을 높이고 공통적인 규약을 제공하기 위한 객체지향의 특성. - 설계 측면의 정의 부모 클래스를 확장시켜 자식 클래스를 만드는 프로그래밍 기법. - 개발 측면의 정의 장점 유지보수성이 향상된다. 개발시간이 단축된다. 기능이 추가되어도 품질이 지속적으로 유지된다. 가독성이 향상된다. 단점 관리자의 오해가 발생할 수 있다. 문법 형식 class extented calss name extends base class name {} 상속의 생성자 super() 상속 시 상위 클래스의 object가 먼저 초기화되어야 하며 이를 지원하기 위한 문법이다.항상 하위 클래스 생성자에서 가장 앞에 코딩되어야 한다...

JavaScript 2022.04.21

[JavaScript] throw(예외 발생)

throw throw문은 사용자 정의 예외를 발생(throw)할 수 있습니다. 예외가 발생하면 현재 함수의 실행이 중지되고 (throw 이후의 명령문은 실행되지 않습니다.), 제어 흐름은 콜스택의 첫 번째 catch 블록으로 전달됩니다. 호출자 함수 사이에 catch 블록이 없으면 프로그램이 종료됩니다. 예외를 사용한다는것은 프로그램을 정지하는것이다. 구문 throw expression; expression : 예외를 발생시킬 표현식 사용 예시

JavaScript 2022.04.21

[JavaScript] Class(클래스), private(접근제어)

Class (클래스) 개념 ES5에서는 클래스가 없으며 객체형, 클로저, 생성자, 프로토타입 등을 이용해 클래스와 유사한 구조를 만들어 사용한다. ES5와 다르게 ES6에서는 클래스 문법을 직접적으로 지원함. 내부적으로 Class는 격국 object형과 같다. 형식 선언과 인스턴스 생성 클래스의 생성자 constructor로 생성자를 호출한다. ES6때 출현. class cs { constructor(){} } this를 통해 object에 변수를 등록한다. (object와 유사함.) * 생성자에 객체를 추가할 시 Shallow Copy(얕은 복사)에 주의한다. * Shallow copy(얕은 복사) 해결. (private 하단 참조) Method 추가 class의 method로 추가 readabilit..

JavaScript 2022.04.20

[JavaScript] Constructor 예제

예제1 원의 넓이와 둘레를 구하는 circle이라는 생성자를 만드시오. * TIP 기본값 매개변수 기본값 함수 매개변수 (default function parameter)를 사용하면 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있습니다. function multiply(a, b = 1) { return a * b; } console.log(multiply(5, 2)); // expected output: 10 console.log(multiply(5)); // expected output: 5 답) 예제1+ 일반 함수 호출과 생성자 호출이 가능한 원의 넓이와 둘레를 구하는 circle이라는 함수를 만드시오. 참고 new.target https://cruella-..

JavaScript 2022.04.19

[JavaScript] new.target

new.target new.target 속성(property)은 함수 또는 생성자가 new 연산자를 사용하여 호출됐는지를 감지할 수 있습니다. new 연산자로 인스턴스화된 생성자 및 함수에서, new.target은 생성자 또는 함수 참조를 반환합니다. 일반 함수 호출에서는, new.target은 undefined입니다. 구문 new.target 예시 예제 일반 함수와 생성자를 이용해 두개의 수를 더하는 함수를 만드시오. 예제2 아래와 같은 코드는 obj가 출력되는 문제가 있다. 아래의 코드를 생성자로 출력할시와 일반 함수로 출력하는 함수를 구하시오. 답)

JavaScript 2022.04.19

[JavaScript] Prototype

Prototype 개념 prototype의 사전적 의미는 “원형"이다. 즉 “원래의 모양”을 뜻한다. 자바스크립트에서 사용하는 거의 모든 데이터는 기본적으로 “객체“(Object type)이다. 객체는 객체마다 기본적으로 가져야 할 기능 및 데이터가 필요하다. 이러한 기능과 데이터를 가진 객체를 prototype이라 하며 자바스크립트에서 특별하게 관리된다. * prototype는 DNA다. 특징 동일한 객체는 동일한 Prototype을 가진다. 즉 아래 a, b는 모두 같은 prototype에서 파생된다. Prototype 또한 객체이기 때문에 추가, 변경될 수 있다. 따라서 특정한 객체 타입의 prototype을 변경하면 그 객체 타입 전체가 영향을 받는다. prototype은 호출시 생략할 수 있다...

JavaScript 2022.04.19

[JavaScript] Closure(클로저) 예제

들어가기 앞서 Closure의 이해 https://cruella-de-vil.tistory.com/47 [JavaScript] Scope(스코프), Closure(클로저), var Scope (스코프) 개념 변수가 유효성을 가지는 범위. 스코프는 기본적으로 프로세스 메모리 맵의 구조에 의존적. 선언된 위치에 따라 스코프가 결정된다. 같은 이름으로 변수가 선언된 경우 스코프 cruella-de-vil.tistory.com 예제 클로저를 이용하여 id, 이름, 국영수 성적을 생성하는 함수를 구현하려 한다. 학번, 이름, 국영수 성적의 getter/setter를 구현하시오. 성적의 평균을 구하는 함수를 구현하시오. (단 평균은 소수점 2자리)

JavaScript 2022.04.18

[JavaScript] 객체지향, Constructor(생성자), new

객체지향 자바스크립트 데이터, 함수 기반 프로그래밍 data가 보호받지 못하는 문제점이 있다. func2 입장에서 data1이 바뀐 이유에 대해서 알 수 없다. 객체지향 프로그래밍 기존의 데이터, 함수 기반 개발에서 객체를 기반으로 구현하는 프로그래밍 객체지향 프로그래밍의 장점 응집도 향상 : 객체 = 속성 + 메서드 재활용성 : 범용성을 가진 객체를 통한 재활용성 증가. 유지보수성 : 코드의 구성 파악 용이, 낮은 결합도로 인한 오류 파급 제한 객체의 생성 방법 Object 형을 이용 사용하기 편함. 정형화된 방식이 없음. 인스턴스마다 코드를 작성해줘야 함. Closure를 이용. Readability가 낮음 독특한 메커니즘을 이용 * 객체를 생성해서 리턴해주는 기능을 가진 함수를 Facroty 함수 ..

JavaScript 2022.04.18

[JavaScript] apply()

Function.prototype.apply() apply() 메서드는 주어진 this 값과 배열 (또는 유사 배열 객체) 로 제공되는 arguments 로 함수를 호출합니다. 구문 func.apply(thisArg, [argsArray]) 매개변수 ˙thisArg옵션 : func 를 호출하는데 제공될 this 의 값. this 는 메소드에 의해 실제로 보여지는 값이 아닐 수 있음을 유의합니다. 메소드가 non-strict mode 코드의 함수일 경우, null 과 undefined 가 전역 객체로 대체되며, 기본 값은 제한됩니다. ˙argsArray옵션 : func 이 호출되어야 하는 인수를 지정하는 유사 배열 객체, 함수에 제공된 인수가 없을 경우 null 또는 undefined. ECMAScript..

JavaScript 2022.04.18

[JavaScript] 소숫점 자리수 정하기 toFixed()

Number.prototype.toFixed() toFixed() 메서드는 숫자를 고정 소수점 표기법(fixed-point notation)으로 표시합니다. 구문 numObj.toFixed([digits]) 매개변수 digits Optional : 소수점 뒤에 나타날 자릿수. 0 이상 20 이하의 값을 사용할 수 있으며, 구현체에 따라 더 넓은 범위의 값을 지원할 수도 있습니다. 값을 지정하지 않으면 0을 사용합니다. 반환 값 고정 소수점 표기법을 사용하여 나타낸 수를 문자열로 바꾼 값. 예외 RangeErrordigits가 너무 작거나 너무 클 때. 값이 0과 100사이의 값이라면 RangeError를 유발하지 않습니다. 구현체에 따라 더 크거나 작은 값을 지원할 수 있습니다.TypeErrorNumbe..

JavaScript 2022.04.18
반응형