728x90 반응형 IT 지식정리/자바스크립트8 자바스크립트 : 이벤트 지난 포스팅에서 자바스크립트의 함수에 대해서 알아보았습니다. 보통 함수를 넘어가면 연산이나 데이타타입과 같은 부분들의 심화된 부분에 대한 내용들을 많이 다루곤 합니다. 저는 개인적으로 많이 사용되는 요소들 위주로 배운 뒤에 심화가 필요한 부분은 그때그때 보충을 하는 방식을 선호하는 편이라 비슷한 부분들은 그냥 넘어가고 많이 사용되는 부분들만 다루도록 하겠습니다.그래서 오늘 다룰 주제는 이벤트입니다. SW뿐만아니라 HW의 펌웨어등의 거의 모든 프로그래밍에서 가장 흥미있고 중요한 부분이 바로 이 이벤트입니다. 프로그래밍에서 "이벤트(event)"란 무엇일까요? 외부에서 특정한 '상태'나 '일'이 발생하였을 때, 그것을 프로그래밍에서 인식하는 것을 의미합니다. 자바스크립트는 html환경에서 구현되기 때문에 h.. 2017. 11. 23. 자바스크립트 퀴즈 - 함수(functions) 2017/11/22 - [IT 지식정리/자바스크립트] - 자바스크립트 : 함수(functions) 자바스크립트 함수 강의에 이은 함수와 관련된 퀴즈들입니다. 1. 아래의 코드에서 선언된 함수가 실행되도록 코드를 추가하시오. 2. 다음 코드에서 잘못된 부분을 찾고 실행이 되도록 수정하시오. 3. 다음 함수가 5*5의 값을 출력하도록 하시오. 4. Hello John이 출력되도록 코드를 추가하시오. Display the result here. 정답 1.f_test(); 2.func f_te { 부분을 function f_test() { 로 수정3.return 5*5; 4.document.getElementById("demo").innerHTML=f_test(" John"); 2017. 11. 22. 자바스크립트 : 함수(functions) 다른 프로그래밍 언어에도 함수가 있듯이, 자바스크립트에도 함수가 있습니다. 함수란 무엇일까요? 어떠한 입력값이 주어졌을 때, 특정 결과값을 돌려주는 것을 뜻하는 데요. 아래의 코드를 참고하시기 바랍니다. function test 위의 코드에서 함수를 myFunction이라는 이름으로 생성을 하였습니다. myFunction은 p1,p2라는 2개의 입력값을 받을 수 있게 만들어 졌습니다. 그리고 p1과 p2를 곱한 값을 return(돌려주게)하게 됩니다. 그리고 다음 코드에서 myFunction(2,5)값을 출력하도록 하였습니다. 그러면 p1은 4이고, p2는 3이 되게 됩니다. 따라서 출력값은 2*5인 10가 출력되게 됩니다. 확인은 html파일로 저장하신 뒤에 브라우저에서 실행해보시기 바랍니다. 위의 예.. 2017. 11. 22. 자바스크립트 : 데이타 타입 자바스크립트에서 사용되는 데이타 타입은 숫자,문자,오브젝트 등이 있습니다.var num = 1; //숫자 var name = "John"; //문자 var person = {name1 : "Kim", name2 : "Park"}; //오브젝트 오브젝트는 프로그래밍의 배열과 유사한 존재 입니다. 아래와 같은 커맨드를 통해서 오브젝트의 내용을 표현할 수 있습니다. JavaScript Objects 데이타 타입이 무엇인지는 typeof 명령어를 통해서 확인이 가능합니다. typeof 5 를 입력한다면 데이타 타입은 number가 되고, typeof '5' 를 입력한다면 string이 출력되게 됩니다. 아래 예시를 통해서 다양한 데이타 타입을 확인 해 보시기 바랍니다. The typeof operator ret.. 2017. 11. 22. 자바스크립트 연산자 우선순위값 목록 자바스크립트의 연산자들의 우선순위값들에 대한 내용입니다. c + (a + b) 에서는 ()가 우선순위가 높으므로 먼저 연산이 되게 됩니다. a + b * c 에서도 역시 *가 우선순위가 높으므로 먼저 연산이 됩니다. 자바스크립트 연산자 우선순위값 목록 Value Operator Description Example 19 ( ) Expression grouping (3 + 4) 18 . Member person.name 18 [] Member person["name"] 17 () Function call myFunction() 17 new Create new Date() 16 ++ Postfix Increment i++ 16 -- Postfix Decrement i-- 15 ++ Prefix Incremen.. 2017. 11. 21. 자바스크립트 : 연산자(operators) 오늘은 자바스크립트의 연산자(operators)에 관하여 포스팅을 하겠습니다. 연산자란, 흔희 말하는 +,-와 같이 연산을 진행하는 요소를 뜻합니다. 연산자 =는 변수에 값을 할당하는 역할을 합니다. 아래와 같이 a라는 변수에 숫자3을 할당할 수 있습니다.var a=3; 아래와 같이 +와 *등의 연산자도 사용할 수 있습니다. html파일로 저장하여 확인 해 보실 수 있습니다. The + Operator 자주 사용하는 연산자들은 아래와 같습니다. + 더하기 - 빼기 * 곱하기 / 나누기 % 나머지 ++ 증가 -- 감소 다음은 자바스크립트에서 지정된 연산자입니다. 간략하게 단축하여 사용할 수 있는 연산자입니다. x+=y 는 x=x+y 와 같음 x-=y 는 x=x-y 와 같음 x*=y 는 x=x*y 와 같음 .. 2017. 11. 21. 자바스크립트 : 변수(variables) 자바스크립트에 대한 첫 내용으로 변수에 관해서 포스팅을 해 보겠습니다.변수(Variables)란 데이타값이 저장되는 장소를 뜻합니다.변수는 var를 통해서 선언이 가능합니다. 그리고 '=' 연산자를 통해서 데이타를 저장할 수 있습니다아래는 변수 x,y,z를 선언하고 각각의 변수에 값을 저장하는 예시입니다.var x = 5;var y = 6;var z = x + y; 위의 내용들을 html로 저장하여 실행하려면 아래와 같이 입력을 하면됩니다. *아래 내용을 메모장이나 텍스트에디터에 붙여 넣은 뒤, test.html로 저장하여서 웹브라우저에서 실행하시면 결과를 보실 수 있습니다.JavaScript VariablesIn this example, x, y, and z are variables. 위의 예시들과 같.. 2017. 11. 21. 자바스크립트 퀴즈 - 변수(variables) 자바스크립트를 익히는데 도움이 되는 기본적인 퀴즈들을 통해서 공부를 해보려고 합니다.기본적인 HTML과 프로그래밍을 하실 줄 알면 자바스크립트를 배우는데 큰 문제는 없습니다.자바스크립트를 처음 접하시는 분들도 제가 포스팅하는 퀴즈들을 풀어보시면 실력을 높일 수 있습니다! ^^ 정답을 .html파일로 저장하여서 브라우저에서 실행을 시켜서 확인하셔도 됩니다~!이번 퀴즈들은 프로그래밍의 가장 기본이라고 할 수 있는 변수(variables)입니다.정답은 가장 마지막에 모두 적겠습니다~ 문제1. 변수 Name을 생성하고 John값을 저장한 뒤 출력하라.(힌트:document.getElementById("demo").innerHTML)Display the result here. 문제2. 변수 num을 생성하고 숫자.. 2017. 11. 20. 이전 1 다음 728x90 반응형