javascript Array객체에 contains 메서드 추가
Array 객체에서 특정 요소를 넘겨주면 해당 요소가 Array 객체에 존재하는지 알고 싶었다.
자바의 contains 메서드가 존재하지 않을까 찾아보니 javascript Array객체에서 제공하는 메서드는 없었고 대신 prototype을 이용하여 함수를 구현하는 예제는 있었다.
prototype이 뭘까 궁금하여 그 특성에 대해서 정리해 보았다.
- 자바스크립트의 모든 객체는 프로토타입이라고 불리는 또 다른 객체를 내부적으로 참조할 수 있다.
- 모든 function 에는 Prototype 객체를 가르키는 prototype 이라는 프로퍼티가 존재 - 객체의 속성을 액세스 했을 때 그 객체의 속성에서 못찾으면 prototype 속성에서 찾는다.
- prototype은 각 객체간 프로퍼티를 공유할 수 있게 하기 위해서 사용한다. - javascript는 클래스의 개념이 없기 때문에 프로퍼티를 마음대로 붙일 수 있다.
- Array 객체에 contains 메서드를 개발자가 추가할 수 있다. 물론 다른 메서드도 추가 가능 - javascript는 함수도 객체다.
다음과 같이 코드를 작성하여 Array 클래스에서도 contains 메서드를 호출하여 사용할 수 있게 구현하였다.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var invenList = new Array();
invenList.push("320x48");
invenList.push("500x500");
invenList.push("100x200");
invenList.push("480x72");
$("#result").html(invenList.toString());
var exist = false;
exist = invenList.contains("100x200");
$("#existElement").text(exist);
});
// contains 메소드 추가
Array.prototype.contains = function(element) {
for (var i = 0; i < this.length; i++) {
if (this[i] == element) {
return true;
}
}
return false;
}
</script>
</head>
<body>
<div id="result"></div>
<div id="existElement"></div>
</body>
</html>
'프로그래밍' 카테고리의 다른 글
| jquery radio 테스트 (2) | 2012.11.06 |
|---|---|
| XML namespace 이해하기 (0) | 2012.11.06 |
| jquery checkbox 전체 선택, 전체 해제, 체크 값 추출 (6) | 2012.11.05 |
| jquery selector 실습 (1) | 2012.11.02 |
| 대입연산자 잘못 쓰면 이렇게 된다. (0) | 2012.11.01 |
| javascript delete 연산자 (0) | 2012.10.29 |
| javascript foreach 사용 방법 (1) | 2012.10.29 |
| spring 2.5 not supported by MultipartResolver 발생 시 해결 방법 (0) | 2012.10.26 |
