본문 바로가기
[JavaScript/Tutorial] 조건문(Conditional Statement) 에서의 주의사항 및 switch 문. 조건문 사용에서의 주의사항 및 switch 문 [이전강좌] Operator 사용 type cast, conversion, control 문, ==, === comparator. JavaScript 에서의 true 와 false 의 조건 Condition 문에서 true 로 인식하는 경우. - 공백이 아닌 string. "0", "abc"- 생성이 된 object. [], {}- 0이 아닌 숫자. 5 Condition 문에서 false 로 인식하는 경우. - 공백 string. ""- NaN- null- undefined- 0 JavaScript 의 Switch 문 JS 에서의 Switch 문은 integer 비교뿐만이 아닌 string 비교도 가능하다.허나 switch 문을 object 로도 표현 가능하.. 2013. 5. 13.
[JavaScript/Tutorial] Type 에 대한 기본 정보. ( Object, Array, Function, Type check ) Type 에 대한 기본 정보 ( Object, Array, Function, Type check) [이전강좌] JavaScript 코드 위치에 대한 주의사항. JavaScript의 Object type 은 대표적으로 Object, Array, Function 이 있다. Object Object 를 만드는 방법은 Constructor(생성자)를 이용한 방법과 object literal을 이용해 만드는 방법이 있다. Literal 을 통해 만드는 오브젝트는 순서없는 key-value pair 로 구성되어 있다. var newObject = new Object(); // 생성자 정의 var newObject2 = { name: "aroundck", class: "javascript" }; // Literal .. 2013. 5. 12.
[JavaScript/Tutorial] JavaScript 코드 위치에 대한 주의사항. JavaScript 코드 위치에 대한 주의사항 [이전강좌] HTML, CSS, 그리고 JavaScript 사람들이 JavaScript 코드를 작성하면서 가장 쉽게 실수하는 것 중 하나가JavaScript 코드를 삽입하는 위치이다. 정확한 이유를 알지 못하고 그냥 일반적인 관행을 따라 태그 안에 넣기도 하고, 태그의 마지막에 넣기도 한다. 만약 JS 코드가 page 에 있는 element를 이용한다면 script 코드는 반드시 해당 element가 로딩된 다음에 수행되어야 한다. 따라서 이 경우에는 body 의 마지막에 들어가는 것이 좋다. 반대로 JS 코드가 page 에 있는 element 와 interaction 이 없다면 head 태그 안에 넣는 것도 좋다. JS 코드는 순차적으로 수행된다는 것을 기.. 2013. 5. 11.
[JavaScript/Tutorial] HTML, CSS, 그리고 JavaScript 웹을 구성하는 아주아주 원초적인 언어들을 이야기하라면 HTML, CSS, JavaScript 를 들 수 있겠다. HTML 은 Contents 를 표현하는데 사용되고, CSS 는 Visual 을 담당하고 JavaScript 는 Interaction 을 통해 Dynamic 한 페이지를 제공하는 것을 담당한다. Hello World Click Me! Click Me2! * querySelector 를 통해 검색되는 녀석은 "첫번째" 로 맞딱뜨리는 tag 이다. * addEventListener 의 parameter 들은 eventName, function, useCapture 이다. 이 중 useCapture 가 true 일때는 capturingPhase 로, false 일때는 bubblingPhase 로 작.. 2013. 5. 8.
[DOM/Tutorial] DOM 의 event flow. ( Capture, Bubble ) 참조 : w3.org 공식 홈페이지 DOM 의 event flow. DOM 의 event 는 Root Node에서부터 Target 노드로, 그리고 다시 Root Node 로 돌아온다. 이 Event 의 순환에는 phase 가 있는데 Root 에서 Target Node 까지 Event가 흘러가는 것을 Capture Phase. Target 에서의 Event 를 Target Phase. 그리고 Target 에서 Root Node 로 다시 돌아오는 것을 Bubbling Phase 라고 한다. * addEventListener 를 걸 때, 세번째 인자인 useCapture 를 true 로 주게 되면, capturingPhase 시에 callback function 이 호출되고, 반대로 useCapture를 fa.. 2013. 5. 8.
[jQuery/Tutorial] Callback 을 잘 사용해보자. JavaScript 는 Callback function 을 전달하기가 쉽다.다른 function 의 argument 로 전달하면, 해당 function 의 실질적인 작업이 끝나면 callback function 이 수행된다. jQuery #1 은 argument 가 없는 myCallBack 이란 이름의 callback function 을 등록한다.이 때 " " 를 넣어 string 화하지 않아야 하며, () 도 넣어서는 안된다. #2 는 callback 전달이 아니라, myCallBack( param1, param2 ) 의 수행결과, 즉 return value 가 get 의 2번째 argument 로 전달되는 격이다. #3 은 argument 를 2개 가진 callback function 을 등록한 경우.. 2013. 5. 8.
[jQuery/Tutorial] CSS 에서 정의한 class 적용하기 & Effect 주기. 출처 : jQuery 공식 홈페이지 jQuery ( JavaScript ) 와 CSS 는 뗄 수 없는 관계. 태그를 통해서 class 정의를 하고,addClass( "className" ) 과 removeClass( "className" ) 을 통해정의된 class 를 추가 및 제거할 수 있다. jQuery jQuery 를 통해서는 effect 를 주는 것도 쉬운데,이 예제에서 사용된 것은 천천히 사라지는 hide( "slow" ) effect 이다. 2013. 5. 8.
[jQuery/Tutorial] window.onload vs. ($document).ready 출처 : jQuery 공식 홈페이지. window.onload 는 html 의 모든 load 가 완료되었을 때 불린다.따라서 이미지가 있을 경우, 로드가 완료될 떄까지 onload 에 있는 코드는 실행되지 않는다. 반면에 jQuery의 $(document).ready 는 사용자의 조작이 가능해진 순간에 불린다.따라서 onload 보다 조금 더 실용적이다. jQuery event.preventDefault() 는 원래 기본 동작을 방지한다.위의 예에는 event.preventDefault() 코드가 들어가서 a 의 기본동작인 link 로의 연결이 되지 않는다. 2013. 5. 8.
반응형

티스토리툴바