JavaScript

[Object] JS - Object Methods - 객체메서드 ★

Object Method 예제

 

<p id="demo"></p>


<script>

var hz = {

  name: "홈짱닷컴",

  host : "Homzzang.com",

  open     : 2012,

  site : function() {

    return this.name + " " + this.host;

  }

};


document.getElementById("demo").innerHTML = hz.site();

</script>

 

결과보기

 

 

this 키워드

 

1.

함수 정의에서 this 키워드는 함수 소유자를 가리킴.

 

2.

위 예제에서, this 키워드는 함수를 소유하는 hz 객체 가리킴.

즉, this.host 의미는 this 객체의 host 속성을 가리킴.

3.

더 자세한 건 여기 참고.

 

 

 

JS Method (메서드)

 

JS 메서드는 객체에서 수행 할 수있는 행위임.

JS 메서드는 함수 정의를 포함하는 속성임.

JS 메서드는 객체 속성으로 저장된 함수임.

 

site : function() { return this.name + " " + this.host; }

 

 

 

Object Method 접근

 

objectName.methodName()

 


 

1.

위 구문을 통해 객체 메서드에 접근 가능.

 

2.

hz.site()는 hz 객체의 site() 메서드라고 표현하고, site는 속성이라 표현.

site 속성이 ()와 함게 호출될 때는, 함수 실행 결과를 반환.

site 속성이 () 없이 단독 호출되면, 함수 정의 구문을 반환.

 


 

[메서드]

 

<p id="demo"></p>


<script>

var hz = {

  name: "홈짱닷컴",

  host : "Homzzang.com",

  open     : 2012,

  site : function() {

    return this.name + " " + this.host;

  }

};


document.getElementById("demo").innerHTML = hz.site();

</script>

 

결과보기 : 홈짱닷컴 Homzzang.com


 

[속성]

 

<p id="demo"></p>


<script>

var hz = {

  name: "홈짱닷컴",

  host : "Homzzang.com",

  open     : 2012,

  site : function() {

    return this.name + " " + this.host;

  }

};


document.getElementById("demo").innerHTML = hz.site;

</script>

 

결과보기 : function() { return this.name + " " + this.host; }

 

 

내장 메서드

 

(예제) 문자열을 대문자로 변환 위해 string 객체의 toUpperCase() 메서드 사용.

 

<p id="demo"></p>


<script>

var hz = "홈짱닷컴 Homzzang.com";

var x = hz.toUpperCase();


document.getElementById("demo").innerHTML = x;

</script>

 

결과보기 : 홈짱닷컴 HOMZZANG.COM

 

 

객체에 새 메서드 추가

 

<p id="demo"></p>


<script>

var hz = {

  name: "홈짱닷컴",

  host : "Homzzang.com",

  open     : 2012,

};


hz.site = function() {

    return this.name + " " + this.host;

}


document.getElementById("demo").innerHTML = hz.site();


</script>

 

결과보기



분류 제목
Basic JS - Break - 반복문중단 (= 브레이크) ★ / Continue - 반복문건너뛰기 (= 컨티뉴) ★…
Basic JS - Type Conversion - 데이터타입변환 (= 데이터유형변환 = 데이터타입변경 = 데이터유형변…
Basic JS - Bitwise Operations -
Basic JS - Regular Expressions -
Basic JS - Errors - Throw and Try to Catch (에러 처리 구문)
Basic JS - Debugging (디버깅/디버그) - (에러/오류) 찾기/제거 방법
Basic JS - Hoisting (호이스팅) - 변수선언끌어올리기 (= 변수선언위치변경)
Basic JS - Use Strict - 엄격모드 ★★★
Basic JS - Style Guide and Coding Conventions -
Basic JS - Best Practices (올바른코딩)
Basic JS - Common Mistakes -
Basic JS - Performance -
Basic JS - Reserved Words -
Basic JS - Versions -
Basic JS - JSON (제이슨) - 데이터 전송 위한 가벼운 자료 형식.
3/89
목록
 홈  PC버전 로그인 일본어
그누앞단언어 1
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티 1
웹유틸
회원센터
홈짱닷컴 PC버전 로그인