javascript 간단한 프로퍼티 속성 질문입니다.

guieenoutis의 이미지


var object = {};  //오브젝트에 빈 객체 할당
var value = 'Minho shipseki'; // 벨류값 할당

//오브잭트에 get&set 메소드 추가
Object.defineProperty(object,'name',{           
    get: function(){            // 콘솔로그 출력 후 벨류를 내뱉음   ??----------#1
        console.log('i came from the getto');
        return value;
    },              
    set: function(newValue){   // 함수에 넣어진 값을 이용하여 콘솔로그 출력 후 벨류는 뉴벨류로 바뀜 ??-----------#2
        console.log('ADa26years : ' +newValue);
        value = newValue;
    }
});
//--------------------#5
object.name = 'BlackNut'; //------#3
console.log(object.name);//--------------#4
   

질문)
1. #3에서 오브잭트 키에 name을,, 속성값에 BlackNut을,, 추가시킨것 뿐인데
왜 ADa26years : BlackNut이란 아웃풋이 뜨는지 궁금합니다.
set: function(newValue) 를 이용하려면 object.set(BlackNut)을 입력해야되는것 아닌가요??
근데 이렇게 위처럼 직접 입력하면 오류가납니다..ㅠ;;

2. #1과 #2의 의미가 잘 이해가 안갑니다.
3. #4에서 "i came from the getto (\n)BlackNut"이 뜨는것은,, 제가 #3에서 블렉넛을 네임 키값에 할당해주었기 때문인데
#5에서 console.log(object.name); 을 입력시,, 블랙넛이 아닌 '민호십세키'가 뜨는데
이말은 곧, 네임 키값에 '민호십세키'가 할당되었기 때문인가요??

도와주실분 있나요?
자바 시작한지 얼마 안되어서 잘 이해가 안가네요.

질문이 조잡하여 죄송합니다.
머리가 너무 뒤죽박죽이네요..

peecky의 이미지

Object.defineProperty()로 인해 object에 name이라는 항목을 추가되고, name을 읽으려고 할 때 get 함수가 실행되며, name을 쓸려고 할 때 set 함수가 실행됩니다.

#4가 name을 읽으려고 시도하는 행위이고, #3이 name을 쓸려고 하는 행위입니다.

#5에서 object.name을 읽으려고 시도하였고, get 함수가 실행되어 line 2에 정의된
value를 리턴해주고, 이 리턴 값이 콘솔에 출력되는 겁니다.

#3에서는 name값을 쓰려고 시도했고, set 함수고 실행되어 콘솔에 ADa... 가 출력되고, line 2에 있는 value 변수가 'BlackNut'이 됩니다.

#4에서는 다시 get 함수가 실행됩니다. #3에서 value의 값이 바뀌었으므로, 바뀐 값이 콘솔에 출력됩니다.

또한, 위의 코드에서 object.set은 정의되지 않았습니다. set 항목을 정의하고 싶으면
object.set = function(newValue) { … };
이런 식으로 하면 됩니다.

guieenoutis의 이미지

명쾌하게 이해가 잘 되었어요!!
저도 지식 많이 쌓이면 꼭 되갚겠습니다.

댓글 달기

Filtered HTML

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

BBCode

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param>
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

Textile

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • You can use Textile markup to format text.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Markdown

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • Quick Tips:
    • Two or more spaces at a line's end = Line break
    • Double returns = Paragraph
    • *Single asterisks* or _single underscores_ = Emphasis
    • **Double** or __double__ = Strong
    • This is [a link](http://the.link.example.com "The optional title text")
    For complete details on the Markdown syntax, see the Markdown documentation and Markdown Extra documentation for tables, footnotes, and more.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Plain text

  • HTML 태그를 사용할 수 없습니다.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 줄과 단락은 자동으로 분리됩니다.
댓글 첨부 파일
이 댓글에 이미지나 파일을 업로드 합니다.
파일 크기는 8 MB보다 작아야 합니다.
허용할 파일 형식: txt pdf doc xls gif jpg jpeg mp3 png rar zip.
CAPTCHA
이것은 자동으로 스팸을 올리는 것을 막기 위해서 제공됩니다.