본문 바로가기
  • think normal

새로워지기486

샘플소스3) javascript 기본 문서구조 ( screen객체) 이번에는 사용자 또는 개발자가 사용하는 모니터 환경에 대해 체크해주는 자바스크립트 코드가 있어 그것들을 확인 할 수 있는 코드를 알아보자. 왜 이런거까지 해야 할까? 이렇게 생각해 보자 만약, 사용자가 30인지 모니터와 17인지 또는 7인치 또는 스마트 폰으로 볼 때마다 각각에 최적화된 화면 또는 서비스를 구성하고 싶다면. " 그것도 자기가 알아서. " (= 앞에서 실컷 떠들었던 객체지향 아닌 기반의 언어라 가능한 ! ) 사실, 실무에서는 엔스크린에서는 다른 방법이 사용되고 있지만 이렇게 응용할수 도 있다는 생각과 경험이 나중에 분명히 도움이 될것이라는 개인적인 생각이다. " 비단- 프로그레밍이 아닌 인생을 살아가는 문제 해결 능력을 키우기 위해. " 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 숫자 객체 _ 응용3 ) 바로 앞에서 작성한 코드가 사용자에겐 게임을 하기 더 편할 것 같다.. 하지만 코드가 좀 길다. ( 필요에 비해서...) 앞서 경험했던 전역변수를 활용하면 3개로 정의하던 함수ㄹ를 단, 하나로 줄일 수 있다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 숫자 객체 _ 응용2 ) 사실...앞서 실행한 예제는 게임이라하기엔... 타이핑을 해야하는 게임은 좀... 그래서 버튼 형식으로 만들어 보았다. 본인의 접근 방식은.. 1.사용자가 사용할 버튼을 만들어준다. 2.우선 전역변수로 랜덤으로 바뀔 수 있는 컴퓨터의 경우의 수를 만든다. 3.사용자가 누를때마다 실행되는 함수를 각각 만들어서 게임을 실행한다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 숫자 객체 _ 응용1 ) 컴퓨터와 할 수 있는 가위 바위 보 게임을 만들어 보자. 우선 모법? 답안이다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 숫자 객체 ) 여섯개의 숫자를 뿌려주는 로또번호 생성기 만들기. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 숫자 객체 ) 정적객체인 Math는 다양한 메소드를 가지고 있다. 숫자가 가진 다양한 속성을 컨트롤하는 메소드들을 예제를 통해 경험해보자. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 함수 객체 ) 함수선언은 아래와 같이 한다. 1) 해더 안에서의 함수선언. function 생성자 함수명(매개변수1,매개변수2) 2) 바디안에서의 객체 생성. 객체이름=new 생성자 함수명(매개변수1,매개변수2) 혹시 기억하는지? 앞에서 언급했던 매개 변수..그녀석들이 다시 나왔다.. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 날짜 객체 _ 응용 ) 이번에는 어떻게 보면 쉬워보일 수 있지만 막상 프로그렘을 짜려하면 막히는 문제가 있다. 바로 요일이다. 한글.. 요일.. 어떻게 하면될까? 사실 영어또는 숫자로는 날짜나 시간과 같이 자동으로 뿌려주게 할 수 있다고 한다. 어쩌아 나도 그렇고 아직 내가 만든 또는 만들...( 아직. ㅋㅋㅋ 앞으로는 모르지만 ㅋㅋㅋ ^^) 프로그렘은 한글이어야 하는데. 이럴때 배열을 사용하면 간단히 해결할 수 있다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 날짜 객체 ) 이번에는 날짜를 표현해주는 객체를 만들어보자 쉬지않고 움직이는 매번 날짜를 개발자 또는 제작자가 정의 할 수도 없을 노릇인데.. 어떻게 하면 표현할 수 있을까? 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 배열 2 ) 배열에 대한 3단 콤보 예제이다. 문제는 이고, 1단 콤보는 이 색이고, : 맨 처음 접근하면서 막 짜본 코드...이렇게 접근했었다..완성은 못했지만... 2단 콤보는 이거, : 모범 답안. 마지막 3단 콤보는 이 색이다. 모범 답안은 밑도 끝도 없이 우선 이력하고 보는 식이라 마음에 안들었다. 그래서 입력할 때도 뭘 입력해야 하는지 물어보고 입력하고 나서도 어떻게 입력했는지 알 수 있도록 예제를 풀어보았다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 객체 그리고 배열 ) 자바는 객체지향 언어이다. 그리고 자바스크립트는 객체기반언어이다. 그렇다면 객체..그는 누구인가? 내 나름의 해석은 이렇다. 객체...그리고 기반 사람도 어떻게 보면 객체이다. 움직이는 자동차, 자전거..흐르는 물. 다만, 멈춰있는 자전거, 점춰있는 차, 그들은 움직여지기를 지향한다. 사람을 필요로 한다. 자바로 만들어져있는 프로그렘들은 입력을 해야 그에 반응한다. 자바스크립트는 우선 실행된다. 이후 사용자의 반응에 반응을 한다. 프로그렘 되어질 때 ( 크기와 범위를 떠나서) 시작과 동시에 자기가 먼저 알아서 수행을 하도록 하면 자바 스크립트이고 실행해서 프로그렘 창이 띄어지고 난후 사용자의 명령을 기다리고 있으면 그것을 자바와 같은 객체 지향의 언어가 아닐까 한다. 다시말하지만 기능과 크기를 떠나서 이.. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수_ 매개변수_응용 ) 매개변수를 한번 응용해 보자. 앞서 보여주었던 배경색 바꾸는 예제를 응용해보면 좀 도 도움이 되지 않을까 한다. 예제를 실행해보면 알겠지만 앞서 예제가 배경만 바구어 주었다면 이번에 수정된 코드를 실행하면 팝업창에 뜨는 값이 매번 다르게 뜨는 것을 알 수 있다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수_ 매개변수 ) 사용자 정의 함수를 통해 프로그렘이 제공해주고 끌어주는 유모차가아닌 스스로 걷는 방법을 배웠다면 이번에는 뛰는 법을 배울차례이다. 파라미터...매개변수...단어 참.. 빡시다... 음.. 나도 고딩때는 나름 문학도였는데... ㅋ 이를테면 사용자 정의 함수가 경우에 수에 따른 유용한 함수를 따로 정의하는 것이라면 매개 변수는 프로그레머 또는 유저가 상황에 따라 값을 정의하거나 선택할 수 있는 기회를 부여해주는 역할을 한다. 그렇게 선택된 변수는 각기 다른 결과같을 도출해 줌으로서 보다 다양한 결과 값을 보여줌으로서 프로그렘과 사용자간 보다 효율적인 소통을 할 수 있게 해준다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수_ 응용 ) 이번엔 좀 더 응용 예제 버튼을 누를때마다 배겨 색을 변화 시켜주는 예제입니다. 사용자가 정의해놓은 함수를 바디테그에서 만든 버튼을 사용자가 누를때마다 온클릭 핸들러는 통해 연결된 사용자 정의 함수로 연결되어 함수를 실행합니다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수2 _ 전역변수_응용 ) 앞에서 지역변수 할 때 함수안에 선언하고도 다른곳에서 사용가능하게 할려면 어떻게하면 할 수 있다고 했죠? 기억하시려나? 답은 아래 예제에 있습니다. ㅎ 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수2 _ 지역변수_응용 ) 지역변수가 변수를 정의한 한수안에서만 실행가능하고 다른 함수에서는 실행이 안된다는게 뻥인가 아닌가를 확인시켜준다. 하나는 실행이 되고 하나는 먹통이거나 오류창을 띄워준다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수2 _ 지역변수 ) 버튼을 눌러보자 이번에 숫자가 증가하지 않는다. onclick이라는 버튼을 누를때마다 사용자에게 보여주는 alert(i)라는 팝업창에서 숫자를 의미하는 i라는 변수는 "one_plus()" 라는 함수안에서만 실행되는 지역변수이기 때문이다. 왜??? 이유는 간단하다. !!! 함수 안에다가 작성을 했으니까, (싱크대를 거실에 놓으면 거실에서도 사용을 할수있다.) i+=1;가 함수 안내서만 실행되는 것이다. 그렇다면 ? 함수내에서 작성을 하고 외부에서도 사용할수있게 할수는 없는걸까? 답부터 말하면 "있다." 간단하다. 변수를 선언할 때 앞에 "var"를 빼고 선언해주면 된다. 이제 생각과 말은 그만하고 한번 해보자. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수2 _ 전역변수 ) 사용자 정의 함수의 첫 예제에서 전체를 보았다면 이번에는 함수에 사용되는 실질적인 도구인 변수에 대해 좀더 집고 넘어가본다. 함수를 요리하는데는 크게 두가지의 도구를 나눌수있다. 이를케면 부엌에 싱크대는 지역변수이다. 도마나 칼은 전역변수이다. 지역변수는 함수내에서만 사용이 가능하다. 전역변수는 외부에서도 사용이 가능하다. 내가 생각해도 아주 기가막히게 적절한 표현같다...ㅋ 이번 예제는 바디에 정의한 버튼을 클릭할 때마다 1씩 증가하는 프로그렘을 만드는 것이다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 사용자정의함수1 ) 내장함수는 자바스크립트가 디폴트로 정의해놓은 함수라면 사용자 정의 함수는 사용자에 의한 자용자를 위한 함수이다. 프로그렘시 자기만의 환경에 초적화시키고 남들과 다른 색다른 방식을 구현하는데 많이 사용된다. 정의한 함수는 여러번 반복해서 호출할 수도 있다. 2011. 4. 10.
샘플소스3) javascript 기본 문서구조 ( 내장함수 ) 샘플소스3) javascript 기본 문서구조 ( 내장함수 ) - 우선 지난 내용 잠깐 복습,,, - break 문 : 최초 조건은 만족하지만 (추가로 옵션을 줘서 ) 빠져나오고 싶을 때. ex)강제종료 continue 문 : 별도로 추가한 조건에 해당할 때만 조건을 건너뛰고. 다음 조건을 실행한다. - 잠깐 내장함수,,, - 정의형 함수 : 사용자가 정의한 함수 내장형 함수 : js의 기능 :: eval(수식문자열/문자를 숫자로 인식), isNaN(), Number(), String(), parseInt(문자를 정수형으로) * "10px" VS. "px10"= 문자가 앞에 나오면 문자로 인식된다. 예제 ) 2011. 4. 9.
샘플소스2) javascript 기본 문서구조 ( 문제2_BY jquery 02 ) js 2_5 예제2_BY jquery 02 예제 2를 요즘 잘나간다던 jquery로 구현한다면? 2 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( 문제2_BY jquery 01 ) js 2_5 예제2_BY jquery 01 예제 2를 요즘 잘나간다던 jquery로 구현한다면? 1 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( 문제2 ) 문제 : 1~25까지의 연속된 숫자로 되어있는 5*5 테이블 만들기 +5의배수에만 빨간색 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( 문제1 ) 문제 1 : 1~25까지의 연속된 숫자로 되어있는 5*5 테이블 만들기 135 135 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( continue 와 break 문 ) continue 와 break 예외 처리를 위한 다양한 방법... 사실..이부분은 살짝 졸아서 예제가 이거밖에 없다.. 좋은 소스 있으신 분들은 좀 알려주시길... 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( while문 ) while문 1. while문은 for문을 풀어 쓴것이라고 봐도 좋을거 같다. (순전히 개인적인..) 왜냐므는.. 자세히 소스를 보면 for문에서 ()안에 정리하던 조건을 한줄씩 풀어서 서술하고 있는 것을 알수있다. 우선 숫자 나열 예제이다. while문 2. 이번엔 숫자를 띄엄띄엄 나열해보자. 그러려면 if문과 섞어야 할거 같다. while문 3.조건을 한번더 꼬아보자.. + 앗 그리고 !do while문.for 문과 while문은 조건에만 만족해야 실행할 수 있다.하지만 만약,예외처리 하고싶은 경우가 생긴다면???사람사는 환경에서 그렇듯 프로그렘에서도 그런일들이 종종있다보다...유두리 있는 프로그렘의 세계...? 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( 반복문 ) 반복문 1. 컴퓨터는 반복되는 번거러움이나 노가다 같은 작업 그리고 자동화를 위해 만들어진 도구이다. 어쩌면 for문은 그들을 대변해주는 아주 적절한 ... 음... 아... 뭐시기냐... 음... 문법? 이라 할 수 있다. (초보티 팍팍나네..) 우선 첫번째 예제라서 i 라고 하는 변수에 일정한 값을 지정해서 뿌려주기로 한다. 반복문 2.두번째 예제는 사용자로부터 옵션을 선택받아 그에 맞는 결과를 도출하는 코드이다. 반복문 3.이번엔 뿌려주는 숫자를 3,6,9,에서 박수라는 문자를 출력해주는 소스로 응용해보자 반복문 4.그동안의 예제가 단순이 뿌려주거나 상황에 맞는 값을 출력해주는 것이 었다면이번 예제부터는 일정한 조건에 맞는 값을 연산해주는 기능을 섞어보겠다. 반복문 5.4번의 예제를 응용해서 이번에.. 2011. 4. 8.
샘플소스2) javascript 기본 문서구조 ( 스위치 케이스문 ) 스위치 케이스문 1)사용자로 부터 입력받은 특정 값 또는 초기 지정한 값에 의해 반응하는 스크립트아래 예제는 가장 처음 예제라서 초기 설정값을 주었다. var menu=1; >> 그래서 >> case 1:won=1000; >> 으로 >> 결국 윈도우에 "1000"이 뿌려진다. 스위치 케이스문 2)사용자로 부터 입력받은 특정 값 또는 초기 지정한 값에 의해 반응하는 스크립트아래 예제는 두번째 예제라서 조금더 활용을 했다.1. 형액형을 물어본다. ( =prompt )2. switch(bl) 의 bl를 따라 가다보면 사용자가 입력한 case에 따라 결과 값이 도출하게 된다. 2011. 4. 8.