# prototype chain

agnusdei1207

프로토타입 체인(Prototype Chain)은 자바스크립트에서 객체 간의 상속을 구현하는 메커니즘입니다. 이를 통해 객체는 다른 객체의 프로퍼티와 메소드를 상속받을 수 있습니다. 프로토타입 체인의 동작 방식과 활용 방법을 살펴보겠습니다. 프로토타입과 [[prototype]]: 자바스크립트에서 모든 객체는 [[prototype]]이라는 내부 슬롯을 가집니다. 이는 해당 객체의 프로토타입(prototype)을 가리킵니다. 객체의 프로토타입은 다른 객체로서, 프로퍼티와 메소드를 가지고 있을 수 있습니다. 프로토타입은 객체가 생성될 때 자동으로 설정되며, Object.create() 메소드를 통해 직접 지정할 수도 있습니다. 프로토타입 체인은 [[prototype]]을 따라 올라가며 프로퍼티와 메소드를 찾는 계층 구조를 형성합니다. 프로토타입 체인의 탐색: 객체에서 특정 프로퍼티나 메소드를 찾을 때, 먼저 해당 객체 자

kyjeong

자바스크립트는 흔히 프로토타입 기반 언어라 불리는데, 그럼 자바스크립트에만 있는 요상한 문법인 프로토타입이 도대체 뭔지! 프로토타입(Prototype) '코어 자바스크립트'에 있는 위 이미지를 풀어서 설명해보면 아래와 같다. 자바스크립트는 함수에 자동으로 객체인 prototype 프로퍼티를 생성해 놓는데, 해당 함수를 Constructor(생성자) 함수로서 사용할 경우, 즉 new 연산자와 함께 함수를 호출할 경우, 그로부터 생성된 instance에는 숨겨진 프로퍼티인 ⎽⎽proto⎽⎽가 자

hwaniee_413

1. 상속 상속은 객체 지향 프로그래밍에서 객체 간의 코드 및 속성을 공유하기 위한 메커니즘이며, 보통은 상위와 하위 객체의 관계를 부모-자식 관계에 빗대어 표현한다. 다른 말로 하면, 상속은 객체의 로직을 그대로 물려 받는 또 다른 객체를 만들 수 있는 기능을 의미한다. 단순히 물려받는 것이 아닌 기존의 로직을 수정하고 변경해서 파생된 새로운 객체를 만들 수 있게 해준다. 아래는 자바스크립트에서의 상속을 구현한 짧은 코드이다. Employee이라는 생성자를 만든 뒤, 이 생성자의 prototype과 Person의 객체를 연결했더니 Employee 객체도 메소드 introduce를 사용할 수 있게 되었고, 자신만의 프로퍼티도 사용할 수 있게 되었다. 그 결과 "My name is John Doe and I work as a Manager" 이 콘솔에 출력되었다. 좀더 자세히 설명하자면, Person 생성자 함수: Person 생성자 함수는 name 인자를

lee2302

공부하다가 프로퍼티가 뭔지 기억이 안나서 뭔가 했는데 속성이였따... 프로퍼티===속성 프로토타입(prototype)이란? >- 자바스크립트의 모든 객체(obj)는 자신의 부모 역할을 하는 프로토타입(prototype)이라는 객체를 가지고 있으며, 객체 지향의 상속과 같이 모든 객체는 그 객체의 부모 객체인 프로토타입으로부터 프로퍼티와 메서드를 상속받는다. 자바스크립트의 모든 객체는 최소한 하나 이상의 다른 객체로부터 상속을 받으며, 이 때 상속되는 정보를 제공하는 객체를프로토타입(prototype)이라고 한다. 부모 객체를 prototype 객체 곧 prototype이라고 한다. Q. arr = [1,2,3] 을 만들었는데, arr에서 .push( ) .pop() 메소드를 사용할 수 있는 이유가 무엇일까? 🧑. 내부적으로 배열 자료형에는 .push( ) .pop() 등을 쓸 수 있게 되어 있나보다. 👨🏻. 그러면 Array라는 부

aimzero9303

프로토타입이란.. 객체의 프로퍼티를 사용할 때, 처음에는 객체 내에서 프로퍼티를 탐색을하여 찾고, 없는 경우에는 프로토타입에서 프로퍼티를 찾는다. 프로토타입은 어디에 있는걸까? name이라는 프로퍼티는 존재한다. 그래서 '엥엥츈'이라는 결과가 나오는 것이다. hasOwnProperty 함수는 객체 안에 프로퍼티가 있는지 검사해서 boolean값으로 알려준다. 그런데 생각해보니까 우리는 name객체안에 hasOwnProperty 프로퍼티를 만든적이 없다. 대체 어디서 온 녀석인걸까? 바로 Prototype( proto )이라는 객체 안에 존재한다! 객체 안에 존재하지 않는 프로퍼티는 이곳에서 찾는것이다! 만약 프로토타입에 존재하는 메소드가 객체 내에 존재 한

wangamy

프로토타입 체인 > 객체 지향 프로그래밍의 특성 중 상속을 JavaScript에서 구현할 때에는 프로토타입 체인을 사용한다. 그럼 여기서 상속인란 무엇일까? 상속에는 두가지 상속이 있다! > 속성 상속(mdn 참고) 자바스크립트 객체는 속성을 저장하는 동적인 "가방"과 (자기만의 속성이라고 부른다) 프로토타입 객체에 대한 링크를 가진다. 객체의 어떤 속성에 접근하려할 때 그 객체 자체 속성 뿐만 아니라 객체의 프로토타입, 그 프로토타입의 프로토타입 등 프로토타입 체인의 종단에 이를 때까지 그 속성을 탐색한다. > 메소드 상속(mdn 참고) 자바스크립트에 "메소드"라는건 없다. 하지만 자바스크립트는 객체의 속성으로 함수를 지정할 수 있고 속성 값을 사용하듯 쓸 수 있다. 속성 값으로 지정한 함수의 상속 역시 위에서 본 속성의 상속과 동일하다. (단 위에서 언급한 "속성의 가려짐" 대신 "메소드 오버라이딩, method overriding" 라는 용어를

youa7878

prototype 최소 하나 이상의 다른 객체로부터 상속받으며, 상속되는 정보를 제공하는 객체 자바스크립트의 모든 객체는 프로토타입이란 객체를 가지고 있다. 모든 객체들은 그들의 프로토타입으로부터 프로퍼티와 메소드를 상속받는다. >1. prototype 객체 자바스크립트의 모든 객체들은 자신의 부모 역할을 하는 객체와 연결이 되어 있다. 여기서 부모 역할을 하는 객체가 프로토타입 객체 or 프로토타입이라고 한다! >2. prototype 프로퍼티 함수 객체만 가지고 있는 프로퍼티 함수 객체가 생성자로 사용될 때, 이 함수를 통해서 부모 역할을 하는 객체(프로토타입)을 가리킴 >3. proto 프로퍼티 함수를 포함해서 모든 객체가 가지는 인터널 슬록 객체 입장에서는 자신의 부모 역할을 하는 prototype 객체를 가리킴 proto 프로퍼티는 객체의 입장에서 자신의 부모 객체인 프로토타입 객체를 내부에 숨겨진 링크로 가지고 있는

ho2yahh

class로 생성한 Stack과 Queue에 공통 기능을 확장하시오. > // 공통: clear(), toArray(), print(), isEmtpy, peek, length 이전 글 : class로 stack과 queue 생성 https://velog.io/@ho2yahh/class와-Array-객체를-이용하여-Stack과-Queue를-구현하시오 문제정의😛 기존에 만들었던 stack과 queue에는 중복기능들이 들어있었다. 이를 해결하기 위해 superClass를 만들고 공통기능 메서드를 추가해야 한다. 상속과 다형성을 이용하고 메서드들은 overriding하여 만들어보겠다. 또한 계속 활용하게될 arr 멤버변수의 오염을 방지하기 위해 은닉성(private)을 추가하고 accessor property로 활용하고 현재 JS class에 없는 기능인 protected를 구현해보고자 한다. > 은닉성 // 캡슐화, 내부(local) 변수 및 메소드 보

fejigu

1. class vs Object 먼저,* class와 Object의 차이*를 정확하게 정리하고 넘어가고자 한다. class는 연관 있는 데이터들을 묶어 놓은 것으로 속성과 행동으로 구성된다. 조금 더 직관적으로 이해하기 위해 붕어빵을 예시로 들어 설명을 하자면,* class는 붕어빵 틀, 템플릿*으로 실제로 데이터가 들어있는 것이 아니라 '이런 저런 데이터들이 들어 올 수 있어'라고 정의하고 한번만 선언한 것이다. 이런 class를 이용해서 실제 데이터를 넣어서 만드는 것(class를 이용해서 새로운 instance를 만드는 것이 Object)이 Object이다. class라는 붕어빵 틀에 팥이라는 data를 넣

hoje15v

프로토타입 기반 언어? > JavaScript는 흔히 프로토타입 기반 언어(prototype-based language)라 불립니다.— 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미입니다. 프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지입니다. 이를 프로토타입 체인(prototype chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간입니다. 정확히 말하자면 상속되는 속성과 메소드들은 각 객체가 아니라 객체의 생성자의 prototype이라는 속성에 정의되어 있습니다. JavaScript에서는 객체

cptkuk91

객체 지향 프로그래밍의 등장 이전.. 절차적 언어 초기의 프로그래밍 언어는 일반적으로 절차적 언어라고 불렀습니다. 절차적 언어에는 객체 지향의 개념이 없는 언어였습니다. 객체 지향 언어 'class'라고 부르는 데이터 모델의 청사진을 사용해 코드를 작성합니다. 현대의 언어들은 대부분 객체 지향 특징을 가지고 있습니다. 객체지향 프로그래밍의 등장은 단순히 별개의 변수와 함수로 순차적으로 작동하는 것을 넘어, 데이터의 접근과, 데이터의 처리 과정에 대한 모형을 만들어 내는 방식을 고안해냈습니다. OOP 프로그램 설계 철학 중 하나입니다. OOP는 객체로 그룹화 됩니다. 객체를 만들고 나며, 메모리상에서 반환되기 전가지 객체 내의 모든 것이 유지됩니다. 객체 내에서 원칙에 따라 메소드와 속성이 존재합니다. 새로운 객체를 만들 때, 속성에 고유한 값을 부여할 수 있습니다. class, instance class는 일종의 원형(original

jgi0105

프로토타입 자바스크립트에서는 생성저의 prototype프로퍼티를 통해 타입의 특징을 정의합니다. contructor 메소드는 Object타입의 프로퍼티 이며 prototype에 의해 정의 되었습니다. Object.prototype.constructor 같도록 수정해보자 > proto = [[Prototype]] prototype 인스턴스 에는 [[Prototype]]이 있고 생성작의 protorype을 참조 할 수 있게 되어 있습니다. 프로토 타입 체인 인스턴스에서 생성자의 [[Prototype]]을 타고 올라가면 프로퍼티를 탐색하는 현상. 정리 자바스크립트는 생성자의 prototype 프로퍼티를 통해 타입의 특징을 정의합니다. 모든 인스턴스는 내부에 [[Prototype]] 프로퍼티를 가지면 이를 통해 생성자의 prototype 프로퍼티를 추적합니다. 인스턴스에서 생성자의 [[Prototype]]을 타고 올라가며 프로퍼티를 탐

djdu4496

오늘의 생각 토이 문제 OT | Toy Problem 9시부터 10시까지 어려운 알고리즘 한 문제씩 풀 예정이다. 5회 이상 기한을 초과하면 다음 섹션에 갈 수 없다고 한다. 성실히 하루에 한 문제씩 풀어보자. 21년 6월 | 섹션 2 첫 날 새 섹션이 시작됐다. 완벽하게 하기 보다, 내가 무엇이 부족했는지 고민하고, 채워나가는 식으로 공부를 해보자. 학습 목표 - OOP 오늘 할 일 페어 프로그래밍 제출 CSS Layout Master Class | #2 Grid 마무리 벨로그 TIL | June_14th Keyword Evernote | CLASS, INSTANCE, PROTOTYPE 내용 정리

smart5265988

ㅎㅎ.. 객체지향 프로그램이 끝나자마자 다음 파트는 Prototype Chain 그래도 클래스와 인스턴스를 공부하고 수업을 듣고나니 조금은 편안했다. 역시 큰 개념을 이해하고 보니 수월 ㅎㅎ 자바스크립트는 클래스가 없고 프로토타입을 기반의 언어라고 한다. (물론 처음 들었을떄는 당황)😅 그럼 프로토타입이 무엇인지 알아보고 어떻게 객체지향 프로그래밍 언어로 활용되고 있는지 살펴보자! 1. Prototype 프로토타입을 사용하게 되면 객체와 객체를 연결하고 클래스처럼 상속받는 형태로 만들어서 사용 할 수 있다. (자바스크립트는 클래스X) ES6에서 클래스라는 문법을 만든것이지 클래스가 있는것은 아님!! (처음에 너무 헷갈렸던 부분 🤓) 2.proto,

jiwon22

TIL - Prototype Chain, class 1. Prototype Chain Prototype Chain이란, 프로토타입의 상위 프로토타입까지 연결되는 구조를 말한다. 하위에 있는 프로토타입은 상위에 있는 프로토타입의 속성과 메소드를 공유받는다. 위와같이 new 키워드를 이용해 steve 인스턴스를 생성하였다. steve를 출력해보면 _ proto _로 프로토타입이 연결되어 있는 것을 볼 수 있다. 이런 형태를 Prototype Chain 이라고 한다. 위 사진을 보면 굉장히 많은 것들이 있다. 오늘은 그 중에서도 proto, constructor, prototype에 대

junhyeok

* Prototype Chain이란?* JavaScript는 흔히 프로토타입 기반 언어(prototype-based language)라 불립니다.— 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미입니다. 프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지입니다. 이를 프로토타입 체인(prototype chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간입니다. *mdn참고 https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/Object_prototypes > ### Keyword 1. proto, constructor, prototype 이 각각 어떤 관계인가? JavaScr

kkt12121

이머시브 과정 5일째 날이다 오늘은 벌써 이머시브 1주차 마지막 날이 되었는데 1주동안 많은 것 을 배워 어떻게 흘러갔는지도 모르겠다... 오늘은 OOP 와 Prototype의 대해서 공부하는 시간을 가지게 되었다. 아직은 잘 이해하지 못했지만 내가 이해한 선에서 간략하게나마 정리해보고 더 공부해보자 ! 🔥Today Lesson🔥 OOP(Object Oriented Programming) Prototype Chain OOP🏳 OOP는 Object Oriented Programming약자로 객체 지향 프로그래밍을 의미한다. 즉 OOP는 여러 객체들이 모여서 서로 상호작용을 하는 것이다. OOP를 이해하기 위해선 기본구성요소인 "객체" 와 "클래스"의 대해서 어느정도 알고있어야 하는데 이전에 포스팅 작성 한게 있다. 간단하게만 말하면 객체와 클래스를 주로 붕어빵과 붕어빵을 찍는 기계라고 흔히들 표현하는데 이 표현이 가장

seungsang00

🤔 자바스크립트의 프로토타입(Prototype)을 이해해보자. 객체 지향 프로그래밍(Object-Oriented Programming, OOP) 객체 지향 프로그래밍은 컴퓨터 프로그래밍의 패러다임의 한 종류이다. OOP는 프로그램을 기능별로 객체(object) 단위로 나누고, 각 객체의 메소드(method)나 필드(field)를 호출하면서 서로 간의 상호작용을 통해 알고리즘을 구성한다. OOP의 핵심은 작은 기능별로 객체를 만들어 놓고, 그 객체들을 조합하여 큰 기능을 구현하는 것이다. 이때 객체를 만들어 내기 위한 설계도와 같은 개념을 클래스(class)라고 한다. >#### 클래스(class) 클래스(class)란 객체를 정의하는 설계도 역할을 해주는 개념이다. 클래스 기반 언어(예를 들어 자바)에서는 이러한 설계도인 클래스를 가지고, 여러 객체를 생성하여 사용한다. 클래스는 객체의 상태를 나타내는 필드(field)와 객체의 행동을 나타내는 메소드(method)

j_jhwww

Prototype 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있다. 그리고 이것은 마치 객체 지향의 상속 개념과 같이 부모 객체의 property 또는 method를 상속받아 사용할 수 있게 한다. 이러한 부모 객체를 Prototype(프로토타입) 객체 또는 줄여서 Prototype(프로토타입)이라 한다. Prototype 객체는 생성자 함수에 의해 생성된 각각의 객체에 공유 property를 제공하기 위해 사용한다. 결론적으로 쉽게 설명하면, 모델의 청사진을 만들 때 쓰는 원형 객체(Original form)이다. constructor (생성자 함수) Prototype 객체는 constructor property를 갖는다. 이 constructor property는 객체의 입장에서 자신을 생성한 객체를 가리킨다. 예를 들어 Person() 생성자 함수에 의해 생성된 객체를 foo이라고 하자. 이 `f

younghoss

Prototype Chain을 말하려면 Object를 알아야한다. JavaScript에서의 거의 모든 객체는 Object의 인스턴스이다. 일반적인 객체는 Object.prototype의 속성과 메소드를 상속받고, 그 중 일부는 숨겨진다. JavaScript는 Class의 개념이 ES6에서 처음 등장했고 이전에는 prototype을 이용해 특정 함수의 '기반 클래스'객체를 만들어 사용했다. Prototype Chain에서 중요한 몇가지 키워드가 있다. Prototype Chain 키워드 1. prototype : Object의 프로토타입(원형) 객체를 나타낸다. JavaScript에서의 거의 모든 객체는 Object의 인스턴스이기 때문에 객체는 Object.prototype의 속성과 메소드를 상속받는다. 를 이용해 다른 객체의 prototype을 상속해줄 수 있다. 은 함수만을 갖을 수 있는 프로퍼티이다. 함수의 프로토타입 객체를 프로토타입 프