티스토리 뷰

Language/JavaScript

[ JavaScript ] 내장함수

MiniNeko 2015. 11. 29. 04:51

참고 : http://enomix.tistory.com/15

1. JavaScript 기초

1) 내장 함수

* 내장 메시지 박스 : alert("Hello."); confirm("정말로 삭제할껴?"); prompt(메시지, 초기값);
* 내장 함수

isFinite(number) : number가 유한수이면 true, 아니면 false를 리턴

isNaN(value) : value가 순수한 문자이면 true, 숫자형태의 문자이면 false를 리턴

number(obj) : obj를 숫자로 변환하여 리턴

string(obj) : obj를 문자로 변환하여 리턴

eval(수식문자열 또는 Object 문자열) : 수식을 처리한 결과를 리턴, Object로 변환하여 리턴

parseInt(문자열, [진수]) : 문자열을 정수로 변환하여 리턴

parseFloat(문자열) : 문자열을 float-실수형으로 변환하여 리턴

escape(string) : ASCII 스트링을 URL로 인코딩

unescape(string) : ASCII 스트링을 URL로 디코딩

encodeURI(string) : 주어진 문자열을 URI로 encoding 한다.

decodeURI(string) : 주어진 문자열에서 encoding 된 URI를 decoding 한다.

encodeURIComponent(string) : 주어진 문자열을 URI로 encoding 한다.

decodeURIComponent(string) :  주어진 문자열에서 encoding 된 URI를 decoding 한다.
•encodeURI() / decodeURI()
최소한의 문자만 인코딩한다  -->  ; / ? : @ & = + $ , - _ . ! ~ * ` ( ) #
예를 들어 다음과 같은 문자는 인코딩하지 않는다. --> http:// ... 등은 그대로.. 
•encodeURIComponent() / decodeURIComponent()
알파벳과 숫자 Alphanumeric Characters 외의, 대부분의 문자를 모두 인코딩한다.
즉, http:// ... --> http%3A%2F%2F 로 변환된다. 
•escape() / unescape()
encodeURI() 와 encodeURIComponent() 의 중간 정도의 범위로 문자를 인코딩한다. 


2) 내장 객체
•Object : 기본 객체 

ex)


var book = new Object(); // empty Object --> var book = {};

book.title = "Ajax 마스터하기";

book.author = "kspark";

book.published_date = new Array("2006", "2007");

book.getInformation = function() { return this.title + ", " + this.author; }

function DisplayPropertyNames(obj)

{

var names = "";

for( var name in obj ) names += name + "
";

alert(names);

alert(obj.getInformation());

}

실행 결과 : DisplayPropertyNames(book);

 •Function : 함수 객체, 객체변수 = new Function([매개변수 리스트], 함수의 처리 내용) 

ex)


var square = function(x) { return x*x }

var sports = new Object();
sports.soccer = new Function(`var name = "soccer"; return name;`);

var sum = new Function( "x", "y", "return x+y" );

function execute()
{
 alert( "Sports name : " + sports.soccer() );
 alert( "sum : " + sum(5,10) );
}

실행 결과 : execute();

•Array : 배열 객체 

length 속성, join(문자열),reverse(),sort(compareFunction),slice(시작위치,종료위치),concat(배열객체)

ex)


var List = new Array();
•Date :  날짜 객체 

getDate, getDay, getFullYear, getHours, getMilliseconds, getMinutes, getMonth, getSeconds, getTime,  getTimezoneOffset, getUTCDate, getUTCDay, getUTCFullYear, getUTCHours, getUTCMilliseconds, getUTCMinutes, getUTCMonth, getUTCSeconds, getYear, parse, setDate, setFullYear, setHours, setMilliseconds, setMinutes, setMonth, setSeconds, setTime, setUTCDate, setUTCHours, setUTCMilliseconds, setUTCMinutes,  setUTCMonth, setUTCSeconds, setYear, goGMTString, toLocaleString, toString, toUTCString, UTC, valueOf

ex)


var date = new Date();

date.getMonth();  date.getDate();

•String : 

length 속성

- 문자열 조작 메소드 : toLowerCase(), toUpperCase(), charAt(인덱스), substring(인덱스1, 인덱스2), slice(인덱스1, 인덱스2),

substr(시작인덱스, 길이), indexOf(문자열), lastIndexOf(문자열), concat(문자열), split(분리자, [개수]), charCodeAt([인덱스]), fromCharCode(숫자)

- 글자 모양을 변경하는 메소드 : big(), small(), blink(), bold(), fixed(), italics(), strike(가운데줄), sub(아래첨자),sup(위첨자), fontcolor("색"), fontsize(크기)

- 위치 이동하는 메소드 : anchor("책갈피명"), link("이동위치");

ex)


var str = "Hello! David";

str.slice(6, str.length);   str.link(#david);

•Math : 각종 수학적 계산을 돕는 Math 객체 

ex)


Math.PI, Math.sin(x), Math.abs(x), Math.max(x,y)

•Number : 수치 형태의 문자열을 수치 데이터로 변환하는 객체, new Number(수치 형태의 문자열); 

 ex)


 var Ten = new Number("10");

•Blooean : 논리 객체, new Boolean(논리값); 

•Screen : Screen.availWidth, availHeight(화면의 실제 너비, 높이 ), 
               Screen.width, height(스크린 실제 너비, 높이), pixelDepth(익스플로워 지원안됨), colorDepth(사용가능색상수) 

•Event : 이벤트 객체 

이벤트 객체

[NC에서의 이벤트 객체]

data : DragDrop 이벤트로 인해 드롭된 객체의 URL이 들어있는 스트링 배열
height, width : 윈도우나 프레인의 길이와 너비(픽셀표시)
pageX, pageY : 픽셀로 나타낸 커서의 수평/수직 위치(페이지에서의 상대적위치)
screenX, screenY : 픽셀로 나타낸 커서의 수평/수직 위치(화면에서의 상대적 위치)
layerX, layerY : 픽셀로 나타낸 커서의 수평/수직 위치, 이벤트가 발생한 레이어에 대한 상대적 위치. Resize 이벤트와 함께 사용하면 layerX와 layerY가 이벤트가 타겟으로 하는 객체의 길이와 너비 지정
target : 이벤트가 전송된 원래 객체
type : 발생한 이벤트 유형
which : 눌려진 마우스 버튼(left:1, middle:2, right:3)이나 눌려진 키의 ASCII값
modifiers : 마우스나 키 이벤트와 연관된 수정자 키(ALT_MASK,CONTROL_MASK,SHIFT_MASK,META_MASK)를 식별

[IE 에서의 이벤트 객체]

screenX, screenY : 픽셀로 나타낸 커서의 수평/수직 위치(화면에서의 상대적 위치)
clientX, clientY : 픽셀로 나타낸 커서의 수평/수직 위치, 이벤트가 발생한 웹페이지에서의 상대적 위치
offsetX, offsetY : 픽셀로 나타낸 커서의 수평/수직 위치, 이벤트가 발생한 컨테이너에 대한 상대적 위치
X, Y : 픽셀로 나타낸 커서의 수평/수직 위치, 이벤트가 발생한 문서에 대한 상대적 위치
srcElement : 이벤트가 전송된 원래 객체
type : 발생한 이벤트 유형
keyCode : 키 누름과 연관된 Unicode 키 코드를 식별
button : 이벤트가 발생했을 때 눌려진 마우스 버튼 식별(0:눌려진버튼없음, 1:왼, 2:오, 4:가)
altkey,ctrlkey,shiftkey : true나 false로 설정하여 이벤트가 발생했을 때 Alt키와 Control키, Shift 키 중에 어떤 것이 눌려졌는지 알려준다.
cancelBubble : true나 false로 설정하여 이벤트 버블링을 취소하거나 활성화한다.
fromElement, toElement : 이동 중인 HTML 요소 지정
reason : 데이터 소스 객체에 대한 데이터 전송 상태를 나타내는데 사용
returnValue : true나 false로 설정하여 이벤트 핸들러의 리턴값을 나타낸다. 이벤트 핸들러에서 true나 false를 리턴하는 것과 같다.
srcFilter I.E onfilterchange 이벤트를 시작하는 filter객체 지정

[이벤트 종류]

※ 이벤트 객체를 재정의할 때는 항상 event 객체를 파라미터로 적어주는 습관이 좋다. 

- Abort (onAbort) : 문서를 읽다가 중단시켰을때(브라우저에서 멈춤을 눌렀을때)

- Blur (onBlur) : 사용자가 입력을 포커스를 원도우나 입력양식 요소에서 제거했을때
- Click (onClick) : 사용자가 입력 양식의 요소나 링크를 클릭 했을때

- Change (onChange) : 사용자가 요소의 값을 바꾸었을 때

- DblClick (onDblclk) : 사용자가 입력 양식의 요소나 링크를 더블 클릭 했을때 

- DragDrop (onDragDrop) : 마우스를 드래그 하는 순간 발생

- Error (onError) : 문서나 이미지를 읽는 중에 강제로 중지하는 순간 발생 

- Focus (onFocus) : 사용자가 입력 포커스를 원도우나 입력 양식의 요소로 이동했을 때
- KeyDown (onKeyDown) : 사용자가 키를 눌렀을때
- KeyPress (onKeyPress) : 사용자가 키를 누르고 있을때
- KeyUp( onKeyUp) : 사용자가 눌렀던 키를 놓았을때

- Load(onLoad) : 브라우저에서 문서을 읽었을때

- MouseDown(onMouseDown) : 마우스를 누르는 순간 발생함

- MouseMove(onMouseMove) : 마우스가 움직일 때 

- MouseOver(onMouseOver) : 사용자가 link나 anchor위로 마우스로 옮겼을때
- MouseOut(onMouseOut) : 마우스가 특정 영역 안에 있다가 나갔을때
- MouseUp(onMouseUp) : 마우스 커서를 이미지 맵이나 링크 위에서 내려 놓을 때

- Move(onMove) : 윈도우나 프레임의 위치가 이동되는 순간 발생

- Reset (onReset) : 사용자가 입력 양식을 초기화 했을 때 

- Resize(onResize) : 윈도우나 프레임의 위치가 이동되는 순간 발생 

- Scroll(onScroll) : 윈도우나 프레임의 스크롤시 발생 

- Select(onSelect) : 입력 샹식의 내용 중 특정내용을 선택한 순간 발생 

- Submit (onSubmit) : 입력 양식을 서버로 보낼때
- Reset (onReset) : 입력양식을 리셋하는 순간 발생 

- Unload(onUnload) : 브라우저에서 문서가 없어졌을 때

• - Unload(onUnload) : 브라우저에서 문서가 없어졌을 때 
•window : 윈도우 내장 객체 http://developer.mozilla.org/en/docs/Gecko_DOM_Reference : DOM window Reference 참조 
•사용자 정의 객체 :  function 객체명(매개변수) {}

Total
Today
Yesterday
최근에 올라온 글
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31