본문 바로가기

javascript

[자바스크립트] .innerHTML script 태그 사용시 에러 해결법 .innerHTML script 태그 사용시 에러 해결법 innerHTML 아래와 같이 script 태그를 넣으면 에러가 생기는 것을 볼 수 있다. test.innerHTML = ""; 이유는 문자열에 script 가 들어가서 생기는 것이다. 이 에러를 해결하려면 아래와 같이 하면 된다 test.innerHTML = "document.write('innerHTML TEST')"; 더보기
[자바스크립트 완벽 가이드 정리] Window 객체 Window 객체 주 역할 : 클라이언트 측 자바 스크립트 프로그램의 전역 객체 1. 타이머 setTimeout(), setInterval() 사용하면 지정한 시간이 흐른 다음 한번 이상의 호출되는 함수를 등록할 수 있다 Window 객체의 메서드로 정의되어 있다 실제 브라우저 창과는 아무 관련이 없다 브라우저 내장객체 window 객체 프로퍼티 status 브라우저의 상태바에 문자열을 출력하는 경우에 사용 defaultStatus 브라우저의 상태바에 초기 문자열을 설정 length 창안의 프레임 수 name 창 이름 self 현재 창 자신, window와 같음 window 현재 창 자신, self와 같음 parent 프레임에서 현재프레임의 상위프레임 top 현재프레임의 최상위프레임 opener open.. 더보기
[자바스크립트 완벽 가이드 정리] 함수 함수 함수 : 한 번 정의하면 몇 번이든 실행할 수 있고 호출 할 수 있는 자바스크립트 코드블록 매개변수 : 함수 몸체 내에서 지역변수처럼 취급 메서드 : 어떤 객체의 속성으로 저장된 자바스크립트 함수 생성자 : 새로 생성된 객체를 초기화 하는데 쓰이는 함수 자바스크립트 함수는 다른 함수 내에 중첩되어 정의될 수 있고 , 함수는 해당 함수가 정의되어있는 유효범위에 속한 어떤 변수에도 접근 가능하다 (클로저) 1. 함수 정의하기 - function - 함수이름 식별자(함수이름) - 쉼표로 구분된 0개혹은 임의 개수의 식별자들과 이 식별자들을 둘러싼 한 쌍의 괄호 - 0개 혹은 임의 개수의 자바스크립트 구문을 포함하는 한쌍의 중괄호 function 함수이름(전달인자1, 전달인자2, … ,전달인자n) { 구문.. 더보기
[자바스크립트 완벽 가이드 정리] 배열 배열 배열 : 정렬된 값의 집합 원소 : 배열 안의 값 인덱스 : 배열의 위치번호 자바스크립트 배열 타입이 고정적이지 않음 (같은 배열에 있는 원소의 값이 서로 다를 수 있다) 32비트 인덱스를 사용한다 크기가 동적이다 배열을 생성하거나 크기가 변경되어 다시 할당을 하더라도 배열 크기를 다시 선언할 필요가 없다 모든 배열은 객체 (배열이 객체의 프로토타입으로부터 속성들을 상속 받은 객체이기 때문) 1. 배열 만들기 1.1 배열 리터럴 배열 리터럴 사용하기 - 대괄호 안에 쉼표로 구분해 나열 한 것 - 값으로는 상수 뿐 아니라 임의의 표현식도 사용할 수 있다 - 객체 리터럴 또는 다은 배열 리터럴을 포함할 수 있다 - 배열 리터럴에서 빠진 부분이 존재할 경우, 해당 부분의 원소 값은 undefined가 된.. 더보기
[자바스크립트 완벽 가이드 정리] 구문 구문 구문 : 어떤 일을 하기 위해 실행 1. 표현문 가장 간단한 형태 : 부수효과가 있는 표현식 할당문 , 함수호출 등이 있음 2. 복합문과 빈 구문 하나의 표현식 안에 여러 표현식을 합칠 때에는 쉼표(,)연산자를 사용 2.1 구문블록 구문블록은 여러 구분을 중괄호로 감싼 것 - 세미콜론으로 끝나지 않음 - 들여쓰기를 해주는 것이 좋다 (가독성, 이해도) - 안에서 선언된 변수는 지역변수가 아닌 전역변수이다 2.2 빈 구문 자바스크립트 인터프리터는 빈 구문을 만나면 아무것도 실행하지 않는다 - 종종 몸체가 비어있는 루프를 만들 때 유용 - 임의로 빈 구문 사용시 코드에 고의로 사용했다는 설명을 주석으로 표시 3. 선언문 식별자를 정의, 변수나 함수를 생성하는 중요한 역할을 담당 var, function.. 더보기
[자바스크립트] 클로저 클로저 클로저 : 함수 내에 선언된 로컬 변수를 외부에서도 참조할 수 있는 기능 보는 관점에 따라 모든 자바스크립트 함수가 클로저라고 볼 수 있음 사용처 this.XXXX를 넘기기 위해 사용한다 private변수(보호 해야 할 변수)에 사용한다 주의점 클로저는 변수만 기억할 뿐 값은 기억 하지 않는다 반복문(for문)에서는 클로저를 사용하지 않는다 클로저를 이해하기 위한 예문 function closureTest(a){ return function(b){ return a + b; } } var test = closureTest(1); alert(test(2)); 1. closureTest(1)을 호출한 순간 아래의 영역에 var a =1이 생성되고 function(b){ return a+b; }가 tes.. 더보기
[Tip] html, css, javascript 연습장 html, css, javascript 세가지를 모두 넣어서 테스트 해볼 수 있는 연습장 같은 사이트 소개합니다. 강좌 보면서 따라서 공부하기 좋은 사이트 입니다 ㅎ 주소 : http://jsfiddle.net/ 더보기
[자바스크립트] 콜백 함수 콜백 함수 디자인 패턴 중 하나인 옵저버 패턴에서 나온 개념 이벤트가 발생시 함수를 통해 전달하는 것 시계의 알람 기능과 비슷하다 (정해진 이벤트 발생시 함수 동작) 특정기능을 수행하기 위한 로직과 기능 수행후 반환되는 결과 값을 가지고 표현하는 로직을 분리 가능 뷰의 분리라는 관점으로 MVC패턴과 유사 아래와 같은 예문을 보면 undefined 값이 출력된다. (결과값이 alert 함수보다 늦게 가져오기 때문) onload=function() { var name; $.getJSON("test.json", "", function(res) { name = res.name; }); alert(name); } 시간차를 두어 해결 할 수는 있다. setTimeout(function() { alert(name);.. 더보기
[Tip] 자바스크립트의 부동 소수점 문제 부동 소수점 문제 JavaScript는 IEEE 754 방식을 사용해서 0.1 + 0.1 + 0.1 = 0.30000000...01 이런 오차가 발생한다 (C#도 같은 문제가 발생한다고 함...) 그래서 화폐단위는 . 을 사용하지 않는 센트 단위로 하는 것이 좋다고 한다 해결하기 위해선 소수점 고정인 toFixed 함수를 사용해서 자릿수 고정 후 자동 반올림 처리를 하면 된다 .toFixed(소숫점을 표현할 자릿수); ex) var num = 3.14159; var n=num.toFixed(2); 결과 : 3.14 ps : 불안하다면 그냥 소수점을 만들지 않는 방식을 택하는 것이 좋을 것 같음!! 더보기
[자바스크립트 완벽 가이드 정리] 표현식과 연산 표현식과 연산자 표현식 : 인터프리터를 통해 값으로 평가되는 자바스크립트 구문 1. 원시표현식 다른 표현식을 포함하지 않은 그 자체 상수, 리터럴 값, 특정 언어키워드, 변수 참조 2. 객체와 배열의 초기화 표현식 새로운 객체나 배열을 값으로 하는 표현식 '객체리터럴', '배열리터럴'로 불림 특정 프로퍼티와 원소의 값을 지정하는 수많은 하위 표현식을 포함할 수 있음 (원시표현식이 아님) 배열 초기화 표현식 [] 빈 배열 [1+2, 2+3] 3,5 두개의 원소를 가진 배열 var matrix = [[1,2,3], [4,5,6], [7,8,9]]; 표현식 자체가 배열이 되어 중첩 배열을 만듬 var sparseArray = [1,,,,5]; 쉼표사의의 값을 생략할 수 있음 객체초기화 표현식은 사각괄호('['.. 더보기