Javascript
객체 지향 프로그래밍
객체 지향 프로그래밍 (OOP, Object-oriented programming)객체 지향 vs. 절차 지향객체 지향 프로그래밍 기본 개념 (OOP Basic Concepts)Encapsulation (캡슐화)Abstraction (추상화)Inheritance (상속)Polymorphism (다형성)JavaScript가 일반적인 OOP 프로그래밍 언어와 다른 점은닉화의 한계 (private키워드)추상화 기능의 부재 (interface 키워드)메서드 호출클로저를 이용해 매번 새로운 객체 만들기클래스와 인스턴스클래스를 만드는 방법클래스 : 속성의 정의클래스 : 메서드의 정의인스턴스를 만드는 방법속성과 메서드의 차이인스턴스에서 속성과 메서드의 사용실전 예제 : 배열실습 : ES5 방식으로 작성된 클래스와 인..
ES6 주요 문법
JavaScript의 표준 버전, ECMAScript(ES)JavaScript 역시 표준화 된 버전이 있으며, 이는 Ecma International에서 기술 규격에 따라 정의하고 발표한다. 최신버전은 ES2019지만, ES6에서 가독성과 유지보수성을 획기적으로 향상할 수 있는 문법이 많이 출시 되었다. spread 문법(전개구문) …배열을 풀어서 인자로 전달하거나 각각의 요소로 넣을 때 사용한다.function sum(x, y, z) { return x + y + z; } const numbers = [1, 2, 3]; sum(...numbers) // 6rest 문법(나머지 파라미터) …파라미터(매개변수)를 배열의 형태로 받을 수 있다. 파라미터의 갯수가 가변적일 때 유용하다.function sum(..
what is 𝒕𝒉𝒊𝒔?
this?JavaScript에서 this 바인딩화살표 함수() =>와 this의 상관관계화살표 함수는 만능이 아니다1. 메서드2. 생성자 함수3. addEventListener()의 콜백 함수this?this는 Object 내에서 해당 객체를 참조하는 키워드로, 보통 클래스를 만들 때 메소드를 호출한 객체를 참조하거나 이벤트 리스너를 호출한 DOM을 지정할 때 많이 사용한다. 전역에서 동작할 때는 전역 객체(window, global)을 참조하며, 함수 내부에서는 함수를 호출하는 방법에 따라 다르게 참조한다.JavaScript에서 this 바인딩Javascript의 this는 다른 언어와 달리 상황에 따라 다르게 바인딩 된다. 앞서 말했듯 전역 공간에서는 전역 객체를 참조하고, 메서드 호출 시 메서드 내..
배열, 객체
배열 (Array)다량의 데이터를 다룰 수 있는 데이터 타입.순서(index)에 대한 정보를 가진 자료구조대괄호[] 를 사용하며, 각각의 요소는 쉼표 , 로 구분한다.실제로 들어가는 값을 요소(element)라 부름순서는 인덱스(index)라 부르며, 0부터 시작한다.배열 내의 값으로도 배열이 들어 갈 수 있다.배열 활용법배열 내부의 값은 인덱스를 사용해 접근, 변경이 가능하다.let myNum = [73, 98, 86, 61, 96] myNum[3]; // 61 myNum[3] = 200; // 세번째 인덱스 값에 200 할당 myNum; // [73, 98, 86, 200, 96] let myNumber = [[13, 30], [73, 8], [44, 17]]; myNumber[0]; // [13, ..
반복문
반복문같거나 비슷한 코드를 여러번 실행 시켜야 할 때 단순한 반복을 보다 효율적이고 간결하게 할 수 있도록 하는 구문.for 구문반복 할 조건을 초기화, 조건식, 증감문 순으로 넣어서 작성한다.let sum = 1; for ( let i = 2; // 초기화 i