벨로퍼트와 함께하는 모던 자바스크립트
1장. 자바스크립트 입문
https://learnjs.vlpt.us/basics/
아래와 같이 객체 Object를 만들 수 있다.
객체 안에 들어가는 것은 속성 Property과 메서드 method
속성 Property는 키 key : 값 value로 구성
object = { key : value }
const pig = new Object(); pig.type = "돼지"; pig.name = "꿀꿀이"; pig.sound = "꿀꿀";
const pig = { type: "돼지", name: "꿀꿀이", sound: "꿀꿀" };
객체 생성자란 객체를 반복적으로 만들 수 있는 틀을 의미한다.
function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; } const pig = new Animal("돼지", "꿀꿀이", "꿀꿀); const dog = new Animal("개", "멍멍이", "멍멍"); const cat = new Animal("고양이", "야옹이", "야옹");
class Animal { constructor(type, name, sound) { this.type = type; this.name = name; this.sound = sound; } } const pig = new Animal("돼지", "꿀꿀이", "꿀꿀); const dog = new Animal("개", "멍멍이", "멍멍"); const cat = new Animal("고양이", "야옹이", "야옹");
function AnimalFunc(type, name, sound) { this.type = type; this.name = name; this.sound = sound; this.say = function () { console.log(this.sound); }; } ㅤ AnimalFunc.prototype.code = function () { console.log(this.sound); }; ㅤ class AnimalClass { constructor(type, namename, sound) { this.type = type; this.namename = namename; this.sound = sound; } say() { console.log(this.sound); } } ㅤ AnimalClass.prototype.code = function () { console.log(this.sound); };
생성된 객체의 생성자 찾기
function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; } ㅤ const pig = new Animal("돼지", "꿀꿀이", "꿀꿀"); ㅤ console.log(pig.constructor.name); // Animal console.log(Animal.constructor.name); // Function
static 키워드를 사용하면 객체가 아니라 클래스에 속하게 만들 수 있다.
객체 차원이 아니라 클래스 차원에서 함수를 구현해야 하는 경우 필요하다.
static 키워드로 만든 함수는 반대로 만들어진 인스턴스에서 불러올 수 없다.
class Pet { constructor(..., sound) { ... this.sound = sound; } static say() { console.log("say " + this.sound); } speak() { console.log("speak " + this.sound); } } ㅤ const turtle = new Pet("엉금"); ㅤ // 클래스 - static console.log(Pet.say); // f say() {} console.log(Pet.say()); // say undefined // 클래스 console.log(Pet.speak); // undefined console.log(Pet.speak()); // not a function ㅤ // 객체 - static console.log(turtle.say); // undefined console.log(turtle.say()); // not a function // 객체 console.log(turtle.speak); // f speak() {} console.log(turtle.speak()); // speak 엉금
프로토타입을 받아올 때 사용, 첫 번째 인자에는 this를 받아온다.
function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; } ㅤ Animal.prototype.say = function () { console.log(this.sound); }; ㅤ function Dog(name, sound) { Animal.call(this, "개", name, sound); // Call 함수 }
super의 2가지 사용법
function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; } ㅤ Animal.prototype.makeNoise = function () { console.log("wooo"); }; ㅤ class Cat extends Animal { // extends constructor(name, sound) { super("고양이", name, sound); // super의 사용 } meow() { super.makeNoise(); // super의 사용 } }
delete 명령어로 프로퍼티를 지우거나 오브젝트를 지울 수 있다.
이건 워낙 고생한 이슈기도 하고, 정말 필요한 부분이라 나중에 다시 더 진하게 보는 걸로...
- 참고 : https://bbangson.tistory.com/78
JSON으로 파싱해서 텍스트를 전부 그대로 붙여넣는 방법이 나와있다.
정말로 이렇게 하는 방법밖에 없는 것인가..
전에 무식하게 포문 다 돌려가면서 했던 것이 맞는 방법이었나보다..