728x90 JavaScript20 (5-4) JS/객체 지향 JavaScript/JavaScript와 기타 다른 객체 지향 언어와의 차이점 은닉화(private 키워드)의 한계 Java나 TypeScript라는 프로그래밍 언어는 클래스 내부에서만 쓰이는 속성 및 메소드를 구분시키기 위해 private이라는 키워드를 제공한다. 이러한 은닉화를 도와 주는 기능이 JavaScript에서는 널리 쓰이지 않는다. 정확히는 지원하는 브라우저가 매우 적다. 아래 TypeScript의 예제로 name이라는 속성이 존재한다. 그러나 private 키워드가 붙어 있어서 클래스 내부에서만 사용 가능하다. // TypeScript 문법입니다. class Animal { private name: string; constructor(theName: string) { this.name = theName; } } new Animal("Cat").name; // 사용 불.. 2021. 8. 23. (5-3) JS/객체 지향 JavaScript/클래스와 프로토타입 JavaScript는 프로토타입 기반 언어이다. 여기서 프로토타입(Prototype)은 원형 객체를 의미한다. 프로토타입 문서를 반드시 읽어 보자. 다음과 같이 Human이라는 클래스를 구현해 본다. 개발자 도구를 열어 다음 코드를 실습해 보자. class Human { constructor(name, age) { this.name = name; this.age = age; } sleep() { console.log(`${this.name}은 잠에 들었습니다`); } } let kimcoding = new Human('김코딩', 30); // 실습해보세요 Human.prototype.constructor === Human; // 결과는 무엇일까요? Human.prototype === kimcoding._.. 2021. 8. 23. (5-1) JS/객체 지향 JavaScript/클래스를 이용한 모듈화 객체 지향 프로그래밍(OOP, Object-oriented programming) 절차 지향 프로그래밍과는 다르게 데이터와 기능을 한 곳에 묶어서 처리한다. 속성과 메소드가 하나의 "객체"라는 개념에 포함되며, 이는 자바스크립트 내장 타입인 object(이하, object literal)와는 다르게 클래스(Class)라는 이름으로 부른다. 객체 지향 프로그래밍은 사람이 세계를 보고 이해하는 방법과 매우 흡사하다. 코드를 추상화하여 직관적으로 생각할 수 있기 때문에 이미 오래 전부터 프로그래밍 방법론으로 매우 빠르게 적용되었다. 객체 지향 프로그래밍을 철저하게 적용한 프로그래밍 언어 Java나 C#과는 다르게 자바스크립트에서 OOP를 구현하는 방법은 조금 독특하다. 클래스와 인스턴스 객체 지향 프로그래밍의.. 2021. 8. 23. (1-2) DOM으로 HTML 조작하기 CREATE - createElement DOM으로 HTML을 조작하는 방법 중 가장 기초적인 새로운 element를 만드는 방법이다. document.createElement('div') [코드] 새로운 div element 를 만든다. [그림] 크롬 개발자도구의 콘솔 탭에서 새로운 div 엘리먼트를 생성해보자. 자바스크립트에서 어떤 작업의 결과를 담으려면 어떻게 해야 할까? 변수를 선언하고 어떤 작업의 결과를 변수에 할당한다. 여기서는 div element를 변수 tweetDiv 에 할당한다. const tweetDiv = document.createElement('div') [코드] 새롭게 생성한 div element를 변수에 할당한다. 아직 화면에 변화가 없는 게 당연하다. tweetDiv 라는 .. 2021. 8. 5. 이전 1 2 3 4 5 다음
