codingfarm

1. 기능 3개의 다른 이미지를 하나로 압춥축후 분리된것처럼 사용한다. 탭을 누르면 현재 선택한 인덱스 값이 무엇인지 알 수 있어야 한다. 미선택, 선택, 마우스 올림 3개의 상태에 따라 이미지를 따로 적용한다. 2. 이미지 3. 코드 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 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92..

1. 클로저란? 함수 내부에 만든 지역변수가 사라지지 않고 계속해서 값을 유지하고 있는 상태. 1 2 3 4 5 6 7 8 9 10 11 12 13 function func(){ var count = 1; //일반 지역변수의 경우 함수 호출이 완료되면 사라지지만. $("#btn").on("click", //클로저를 이용하면 함수호출 완료 후 사라지는 //지역변수를 사라지지 않는 데이터 저장소로 만들 수 있다. function(){ count++; alert("count = " + count); } }; } Colored by Color Scripter cs 기본 문법은 아래와 같다. 1 2 3 4 5 6 function 외부함수(){ var 변수A; function 내부함수(){ 변수A 사용; } } c..

1. 콜백 함수란? 1 2 3 4 function 함수이름(calback){ ... callback(결과); } cs 함수 내부의 처리 결과값을 함수 외부로 내보낼 때 사용 일종의 return 문과 비슷한 기능 특정 함수의 매개변수로 콜백 함수를 넘긴 후 처리 결과를 콜백 함수의 매개변수에 담아 콜백함수를 호출한다. 이 구조를 통해 로직 구현 부분과 로직 처리 부분을 나눠 코딩한다. 이에 따라 로직구현부분은 동일하고 로직처리부분을 다양하게 처리해야 하는 경우 유용히 사용 가능하다. 콜백 함수 사용 전: 1 2 3 4 5 6 function 함수이름(calback){ //로직 구현 부분 //로직 처리 부분 } 함수이름(); cs 콜백 함수 사용 후 1 2 3 4 5 6 7 function 함수이름(calb..

1. 중첩함수란? 함수내부에 만들어지는 함수를 중첩함수라 한다. 1 2 3 4 5 6 7 8 9 function outer(){ //inner를 중첩함수라 부른다. function inner(){ //codes... } inner(); } outer(); cs 2. 용도 2-1. 내부 전용 함수 함수 내부에서만 지역변수처럼 사용하기 위해 만들어 쓴다. 일반적으로 아래처럼 이름이 없는 이벤트 리스너로 많이 사용된다. 1 2 3 4 5 6 7 8 function startHello(){ var count = 0; setInterval(function(){ count++; document.write(count + " 안녕하세요.", " "); }, 1000) } startHello(); Colored by C..

1. 함수 분류 함수는 크게 2가지로 나뉘어 집니다. 1. 사용자 정의 함수 사용자가 필요한 기능을 직접 만든 함수 2. 자바스크립트 코어 함수 자바스크립트가 기본적으로 제공하는 함수 ex : parseInt(), parseFloat() 2. 사용 방법에 따른 함수 종류 함수 종류 내용 일반 함수 가장 일반적으로 사용한 함수 중첩 함수 함수 안에 있는 함수 콜백 함수 실행결과값을 리턴이 아닌 매개변수로 넘어온 함수를 호출해서 넘겨주는 방식을 콜백이라 하며 이때 매개변수로 넘어온 함수를 콜백함수라고 한다. 클로저 함수 일반적으로 함수의 호출이 끝나면 함수 내부의 지역변수는 자동으로 사라지지만 클로저 함수는 사라지지 않고 그대로 남는다. 이러한 현상을 클로저라 한다. 멤버 함수 클래스 내부에 만들어지는 함수..

1. function 키워드를 이용하는 방법 1 2 3 4 5 function hello(name){ document.write(name+"님 환영합니다."); return 5; } var integer = hello("honggildong"); cs 2. 함수 리터럴을 이용하는 방법 1 2 3 4 var hello = function(name){ document.write(name+"님 환영합니다."); } hello("ddandongne"); cs 3. Function 객체를 이용해서 정의하는 방법 1 2 var hello = new Function("name", "document.write(name + '님 환영합니다.')"); hello("ddandongne"); Colored by Color S..

타입 리터럴 방식 객체 방식 숫자 var age = 10; var name = new Number(10); 문자 var name = "ddandongne" var name = new String("ddandongne"); 불린 var cold = true; var cold = new Boolean(true); 배열 var aryData = ["data1", "data2", "data3"]; var aryData = new Array("data1", "data2", "data3"); 일반적으로 실무에서는 간결성과 편리성 때문에 리터럴 방식을 즐겨쓴다. 하지만 리터럴방식은 자바스크립트 엔진에 의해서 객체방식으로 자동변환되어 실행된다. 일종의 암시적 형변환이 일어난다고 보면 된다. 함수 리터럴 함수 역시 리터..

프롬프트창에 값을 입력받아서 1이면 "당첨! 냉장고", 2이면 "당첨! 세탁기", 3이면 "당첨! TV", 이외의 경우는 모두 "꽝입니다."를 출력하는 코드를 구현한다. 1234567891011121314151617 var ret = window.prompt("두궁두궁! 행운의 번호를 고르세요."); if(ret == "1") document.write("당첨! 냉장고"); else if(ret == "2") document.write("당첨! 세탁기"); else if(ret == "3") document.write("당첨! TV"); else document.write("꽝입니다."); Colored by Color Scriptercs

$\bullet$ JavaScript는 웹페이지를 동적으로, 프로그래밍적으로 제어하기 위해서 고안된 언어다. $\bullet$ 그렇기 때문에 오늘날 가장 중요한 플랫폼이라고 할 수 있는 웹브라우저에서 유일하게 사용할 수 있는 프로그래밍 언어이다. $\bullet$ 최근에는 HTML5의 적용이 가속화되면서 지금까지 모바일 환경에서 네이티브 앱(안드로이드, IOS)으로 구현해왔던 기능이 웹에서도 대부분 구현할 수 있게 되고 있다. $\bullet$ 웹이 크로스플랫폼이라는 점, 검색 가능하다는 점, 네이티브 디바이스를 제어할 수 있는 하드브리드 시스템(phonegap 등)이 존재한다는 점에서 웹의 중요함은 더욱 확대될 전망이다. 자연스럽게 웹에서 구동되는 유일한 언어인 JavaScript의 중요함도 점점 커질..