프로토타입 객체를 정의하고 new연산을 통해 인스턴스객체들을 만들 수 있습니다.


function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.walk = function(spd){
console.log(spd+" 속도로 뛰는중");
}
//Person 객체 2개 생성
var person01 = new Person('진쓰',21);
var person02 = new Person('잠와',22);
console.log(person01.name+ ' 객체의 walk(10) 호출');
person01.walk(10);




Person 프로토타입 객체를 만들려면 Person 함수를 정의해야합니다.

자바스크립트에서는 함수도 객체입니다. 함수도 객체의 역할을 할 수 있습니다.



new연산자로 호출되는 함수는 객체를만들기위한 함수로 분류되며, 이러한 함수를 생성자라합니다.



그리고 walk 메소드 할당할때

Person.walk = funcion() {..} 같은 형태가 아니라

Person.prototype.walk = function()... 같은 형태로 만듭니다.



Person이 데이터를 담기위해 만들어진게 아니라다른 인스턴스 객체를!

만들기위한 원형틀(마치 자바의 class같은)로 만들어졌기 떄문입니다.



그리고 메모리를 효율적으로 관리할수있다고도합니다.

함수뿐만 아니라 데이터를 추가할때도 prototype을 쓰면됩니다.


prototype 속성은, 객체를 생성할때 자동으로 생성됩니다.


뭐 prototype을 안써도 가능은합니다만 좀더 메모리관리에 효율적입니다.



//배열 생성
var Users = [{name:'진쓰',age:20},{name:'잠와',age:22}];

console.log('배열요소수:%d', Users.length);

for(var i=0; i< Users.length; i++){
console.log('배열 요소 #'+i+': %s', Users[i].name);
}







var Person = {

//객체를 생성할때 속성과 함수를 아래와 같이 넣을수있습니다.
age1 : 21,
add1: function(a,b){
return a+b;
}
}; //객체 생성.


//객체를생성하고나서도, 속성값들을 넣을 수 있습니다.

Person['age'] = 20; //Person 객체에 age 속성 추가및할당
Person['name'] = '진쓰';
Person.phone = '0107777'; //Person 객체에 phone 속성 추가및할당(이런식으로도 가능)


//함수도 추가할 수 있습니다.

Person.add = function(a, b){
return a+b;
};


//함수를 변수에 할당할수있습니다.

var myMin = function(a,b){
return a-b;
}


객체의 속성에 할당합니다.

Person['min'] = myMin;



console.log("나이 : %d", Person.age1);
console.log("나이 : %d", Person.age);
console.log("이름 : %s", Person.name);
console.log("전화 : %s", Person.['phone']);
console.log("더하기 : %d", Person.add(10,20));
console.log("더하기 : %d", Person.add1(10,20));
console.log("빼기 : %d", Person.min(10,5));








자료형 설명



  Boolean [기본자료형]

 true와 false의 두가지 값을 가지는 자료형

 Number [기본자료형]

 64비트 형식의 IEEE 754 값이며 정수나 부동소수값을 가지는 자료형.

    

 참고: NaN(숫자가아님.), Number.MAX_VALUE => +무한대 

 Number.MIN_VALUE - 무한대

 String [기본자료형] 

 문자열 값을 가지는 자료형

 undefined 

 값을 할당하지않는 변수의값

 null 

 존재하지않는 값을 가리키는 값

 Object 

 객체를 값으로 가지는 자료형

 객체는 속성들을 담고있는 가방(Collection)으로 볼수있으며,

 대표적객체로 Array, Date 등이 있음.


    

자바스크립트는 변수상자 크기를 명확히 알수없어서, typeof 연산자 제공합니다.


자바스크립트 변수선언은 var로 선언가능. 

자동으로 Number나 String 판단.



var age = 20;
console.log("나이 : %d", age);
var name ="걸스데이";
console.log("이름: %s", name);




안녕하세요. 내일이면 일본여행가는 진쓰입니다.

자바스크립트 8장 내장객체 - String 객체의 속성과 메소드 포스팅 시작하겠습니다.



목차

1. string객체 특징

2. string객체 속성

3. string객체 메소드



1. string객체 특징

- 자바스크립트에서 문자열을 다루는 객체입니다.

문자열 객체 생성방법 2가지가 있습니다.


- 예)

 var str = new String(“Have a nice day!”)

 var str=“Have a nice day!”



2. string객체 속성

length : 문자열의 개수를 나타냅니다.


예)

- var str=“Nice to meet you!”

- cnt  = str.length

- document.write(cnt) == 17



<html>

<head>

<title> 8장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">


var str = new String("Have a nice day!");

var str2 = "Have a nice day!~!";

document.write(str.length+ " " + str2.length +"<br>");

</script>

</body>

</html>

 





3. string객체 메소드 들입니다.


메소드

기능

charAt(index)

index 위칭의 문자를 알아냅니다.

concat(문자열)

두 문자열을 하나의 문자열로 만듭니다.

indexOf(문자열)

왼쪽부터 문자를 검색 후 지정된 위치의 문자를 알아냅니다.

lastIndexOf()

오른쪽부터 문자를 검색 후 지정된 위치의 문자를 알아냅니다.

slice()

문자열의 일부분을 추출해냅니다.

split()

문자열을 분리 시킵니다.

substr()

문자열을 추출 해냅니다.

subString()

문문자열을 추출 해냅니다.

toLowerCase()

문자열을 소문자로 만듭니다.

toUpperCase()

문자열을 대문자로 만듭니다.



메소드

기능

charAt(index)

index 위칭의 문자를 알아냅니다.

concat(문자열)

두 문자열을 하나의 문자열로 만듭니다.

indexOf(문자열)

왼쪽부터 문자를 검색 후 지정된 위치의 문자를 알아냅니다.

lastIndexOf()

오른쪽부터 문자를 검색 후 지정된 위치의 문자를 알아냅니다.

slice()

문자열의 일부분을 추출해냅니다.

split()

문자열을 분리 시킵니다.

substr()

문자열을 추출 해냅니다.

subString()

문문자열을 추출 해냅니다.

toLowerCase()

문자열을 소문자로 만듭니다.

toUpperCase()

문자열을 대문자로 만듭니다.


.


<html>

<head>

<title> 8장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">


document.write("글자를 크게 ".big() + "글자를 작게".small() + "<p>") 

document.write("글자를 굵게 ".bold() + "글자의 타자기체".fixed() + "<p>") 

document.write("글자의 이탤릭체 ".italics() + "글자 가운데 줄(취소선)".strike() + "<p>") 

document.write("글자의 아래첨자 ".sub() + "글자의 위첨자".sup() + "<p>") 

document.write("글자크기 ".fontsize(7) + "글자색".fontcolor("red") + "<p>") 

</script>

</body>

</html> 

 




<html>

<head>

<title> 8장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">

var str1 = "korean power";

var str2 = "한국인의 힘";

var str3 = "인삼드세요~";


document.write("일 : " + str1.length + "<br>") ;

document.write("이 : " + str2.length + "<br>") ;

document.write("삼 : " + str3.length );

</script>

</body>

</html>

 





감사합니다. 여러분도 어서 휴가가세요. :)



안녕하세요. 진심으로 풀스택개발자가 되고싶은 진쓰입니다.



목차입니다.

1. Date 객체 특징

2. 예제




1. Date 객체 특징


- 날짜와 시간에 대한 객체생성 할 수 있습니다.

객체 생성 형식 : today = new Date() 이용합니다.


- 현재 날짜 시간에 대한 정보 가져오는 메소드들 입니다.

    getYear(), getMonth(), getDate(), getDay(),

 getHours(), getMinutes(), getSecomds(), getTime()


- 현재 날짜 시간에 대한 정보 세팅하는 메소드들 입니다.

    setYear(), setMonth(), setDate(), setDay(), 

setHours(), setMinutes(), setSecomds(), setTime()


parse(날짜) : 1070년 1월 1일 00:00:00 이후의 경과 시간을 1000분의 1초 단위로 리턴한다.


- toLocalString() : 날짜를 문자열 형식으로 변환한다.


<html>

<head>

<title> 7장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">

var Today = new Date() 

var year = Today.getFullYear()

document.write("년도: "+year+"<br>");

 


var month = Today.getMonth() + 1

document.write("월: "+month+"<br>");

 

 

var date = Today.getDate()

 document.write("날짜: "+date+"<br>");

 

 

var hour = Today.getHours()

var minute = Today.getMinutes()

var second = Today.getSeconds()


document.write("현재 시간 : ") 

document.write(hour + "시 " + minute + "분 " + second + "초 </h4>")  

</script>

</body>

</html>

 




2. 예제

- 1초마다 배경색이 달라지는 프로그램 작성해보겠습니다. (단, if문을 이요해서 작성합니다.)

<html>

<head>

<title> 7장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">

  var now = new Date();

document.write(now.getSeconds()+"<br>");

if(now.getSeconds()%2==0){

document.bgColor = "pink"; 

}

else{

document.bgColor = "lightblue";

}

</script>

</body>

</html> 

 




고생하셨습니다. 저는 일본여행을 다녀오겠습니다 :)

안녕하세요. 깊게학습한것을 현업에 써먹고싶은 진쓰입니다.

자바스크립트 객체, 배열 포스팅 시작하겠습니다.

같이 묶은이유는 둘다 객체 개념으로 이해하시면 되기때문입니다.

new라는 예약어를 통해 배열과 객체는 생성하실 수 있습니다.




1. 객체 정의

- 객체를 사용하기 때문에 객체기반언어 입니다.

- 객체는 속성(property)과 methods 를 가집니다.

- function으로 정의된 생성자 함수의 객체의 정의는 new를 이용합니다.

- 생성자함수 안에는 this라는 예약어를 이용해 정의합니다.




2. 객체 사용방법

일반적인 객체지향언어에서의 사용법과 동일합니다.


- 즉 객체이름 다음에 점(.)을 찍고 속성이나 메소드를 써주면 됩니다.



* 객체 선언방법 


function grade(Name, kor, eng, mat)

  this.name = Name 

  this.kor = kor 

  this.eng = eng 

  this.mat = mat 

}



메소드선언에도 사용하는 function이라는 키워드가 사용됨을 보실 수 있습니다.

또한, 파라메터 역시 적어주는데, 개발자 임의로 정할 수 있습니다.

this 라는 예약어를 통해, 객체의 멤버변수와, 함수를 저장할수 있습니다.



<html>

<head>

<title> 6장 예제 </title>

<script language="javascript">

function print(){

document.write(this.name+"<br>");

document.write(this.kor+"<br>");

document.write(this.eng+"<br>");

}

function Score(name, kor, eng)

{

this.name = name;

this.kor = kor;

this.eng = eng;

this.print = print;

}

</script>

</head>


<body>

<script language="javascript">

jinss = new Score("진쓰", 100, 80);

park = new Score("영수", 70, 50);


jinss.print();

park.print();

</script>

</body>

</html>

 


name, kor, eng 멤버변수를 가지는 Score라는 객체를 정의했습니다.

그리고 print라는 메소드를 정의해서, 객체내의 print 멤버변수가 print 메소드를 가르키도록 했습니다.


또한 객체를 생성할때는 new라는 예약어를 사용하시는것을 볼 수 있습니다.


3. 객체배열 특징


 -내장객체 Array 객체를 의미한다.

- 접근 방법

   배열이름[인덱스] : 인덱스는 0부터 시작 합니다.


- 생성방법

  배열이름 = new Array(개수)


- 예) 

   Arr_Name = new Array(10)




 <html>

<head>

<title> 6장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">

my_array = new Array(5);

my_array[0] = "가";

my_array[1] = "control & instrumentation";

my_array[2] = "유튜브";

my_array[3] = "Jinss";

my_array[4] = "mybuddy";

for(var i=0;i<5;i++){

document.write(my_array[i]+" ");

}

</script>

</body>

</html>

 


객체 배열을 선언할때도 new라는 예약어를 사용하여 생성합니다.

예제에서는 다양한 문자열을 넣고 출력하는것을 확인할 수 있습니다.

자료형을 배열로 선언하였기 때문에, 연속적인 인덱싱으로 접근할 수 있습니다.

여기서는 for문을 통해서 접근하는 예제를 보실 수 있습니다.


.


4. array객체 메소드


- join() : 배열을 하나의 문자열로 만들어준다.

- sort() : 배열의 값들을 순서대로 정렬한다.

- reverse() : 배열안에 값들을 순서대로 재정렬시킨다.

- concat() : 두 개배열을 하나의 배열로 만든다.

- slice() : 배열의 일부분의 값을 추출 합니다.


 <html>

<head>

<title> 6장 예제 </title>

<script language="javascript">

</script>

</head>


<body>

<script language="javascript">

my_array = new Array("사과","배","바나나");

for(var i=0;i<3;i++){

document.write(my_array[i]+"<br>");       //배열 전체 출력합니다.

}

document.write( "<br><br>");

document.write( my_array.join()+"<br>");      //하나로 합칩니다.

document.write( "<br><br>");

document.write( my_array.join("와 ")+"<br>");    // 합칠때 "와" 로 합칩니다.

document.write( my_array.join("& ")+"<br>");    //합칠때 &로 합칩니다.

array1 = new Array("오징어", "낙지", "문어","꼴뜨기");     //1번 인덱스전껄 자르고, 3번인덱스이상부터 짜릅니다.

array2 = array1.slice(1,3);


document.write(array2); 

</script>

</body>

</html>

 




힘찬 월요일 시작해봅시다! 감사합니다. :)

안녕하세요. 상품화 제품을 개발해본적 있는 진쓰입니다.

자바스크립트 5장 함수의 개요 및 내장함수 블로그 포스팅 시작하겠습니다.


목 차

1. 함수 개념

2. 함수 구조

3. 함수의 호출, 리턴

4. 내장함수 - alert

5. 내장함수 -  prompt

6. 내장함수 - confirm




1.  함수의 개념

-함수란, 목적을 가진 루틴을 구성하는 부분. 호출을 통해서 실행되며, 반환값을 가진다.



2. 함수의 구조

   function  함수의 이름(매개변수, 매개변수…){


                    함수 수행문…


      }



크게 함수의 이름, 매개변수, 함수 수행문 으로 구성됩니다.

또한 예약어 function이 붙습니다.

매개변수는 필요에 따라 넣어도 안넣어도 됩니다.


 


3. 함수의 호출과 리턴


함수 호출

: 함수의 이름을 프로그램에 삽입합니다.


리턴(RETURN)

: 반환되는 값을 의미한다.


<html>

    <head>
        <title> 5장 예제 </title>
        <script language="javascript">
            function Max(x,y){      // 사용자로 부터 입력받은 x와 y를 비교해서 큰값을 반환하게 됩니다.
                 if (x>y)
                   return x;
                 else if( y>x)
                   return y;     
              }
        </script>
    </head>


    <body>
        <script language="javascript">
          var x,y,res;
               x = prompt("값을 입력하세요~");
               y = prompt("값을 하나 더 입력하세요~");
               x= parseInt(x);  //사용자로부터 값을 받을수있는 내장함수 입니다.
               y= parseInt(y);

               res = Max(x,y);   //Max라는 함수를 호출하였습니다. 사용자로부터 입력받은 x와 y를 Max 함수 파라메터로 넘기게 됩니다.
               document.write(res);

        </script>   
    </body>

</html>

 



3과 10을 입력하였을때 결과화면은 10이 출력됨을 확인하실 수 있습니다.


문제


- 두 개의 정수값과 연산자를 입력받아 계산하는 프로그램을 작성하시오.


<html>

<head>

<title> 5장 예제 </title>

<script language="javascript">

function calc(a,b,p){        

switch (p){

  case '+' :

return (a+b);

  case '-' :

return (a-b);

  case '*' :

return (a*b);

  case '/' : 

return (a/b);

}   

 }


</script>

</head>


<body>

<script language="javascript">

var a,b,p, res;

  a = prompt("값을 입력하세요.~");

  b = prompt("값을 하나더 입력하세요.~");

  p = prompt("연산자를 입력하세요.~");

  a=parseInt(a);     //웹을 통해서 입력받는 prompt 내장함수는 전부 문자로 받기 때문에 parseInt로 숫자로 바꿔줘야합니다.

  b=parseInt(b);

  res = calc(a,b,p);

  document.write(res);

</script>

</body>

</html>

 

처음입력에 3

두번째입력에 8

세번째 입력에 + 

를 넣으면 11이 출력됨을 확인하실 수 있습니다.




4. 내장함수 alert

-단순히 메시지를 나타내고자 할 때 사용된다.

-사용법
: alert(“문자열”)

<HTML>

<HEAD><TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

 

function OK()

{

  alert(" 예 배고파요. ");

}


function no()

{

  alert("아니오 배불러용.");

}


</SCRIPT>

</HEAD>

<BODY>

배고프십니까

<FORM>

<INPUT TYPE="button" VALUE="예" onClick="OK()">    //예를 누르면 OK() 함수가 호출된다.

<INPUT TYPE="button" VALUE="아니오" onClick="no()">//아니오를 누르면 no()함수가 호출된다.

</FORM>

</BODY>

</HTML>


 




5. 내장함수 prompt


내장함수 prompt

-사용자의 입력을 받아 자바스크립트로 인식시킬때 사용하는 내장함수이다.


-prompt(“문자열”)

 


<HTML>

<HEAD>


<SCRIPT LANGUAGE="JAVASCRIPT" >

<!--

    var su;

    su=prompt("값을 입력 하세요");    //유저로부터 문자열을 입력받습니다.

    document.write("입력된 값은  " + su + "입니다.")

//-->

</SCRIPT>


</head>

<BODY>


</BODY>

<HTML>


 


.



6. 내장함수 confirm

- 확인과 취소 버튼을 가지는 메시지 상자입니다.




- 확인을 선택하면 true 반환 합니다.

- 취소를 선택하면 false 반환 합니다.


<HTML>

<HEAD>

<SCRIPT LANGUAGE="JAVASCRIPT"> 


  var res;


  res = confirm("계속하겠습니까?");


  if (res == true) 

    document.write("진행을 선택했습니다.");

  else

    document.write("취소 되었습니다.");

</SCRIPT>

</HEAD>


<BODY>

</BODY>

</HTML>


 






감사합니다. 일요일 마무리 잘하세용. :)


안녕하세요 풀스택 개발자를 꿈꾸는 진쓰입니다.

자바스크립트 4장 -   제어문2 - 반복문 포스팅 시작하겠습니다.


목차입니다.


(1). for 문 개념

(2). for 문 원리

(3). while문 개념

(4). while문 원리

(5). do~while문 개념

(6). while과 do~while의 차이




(1). for 문 개념


제어문 : 프로그램이 흐름을 제어 합니다.

제어문의 종류: 

        - 비교문, 반복문이 있습니다.

비교문

        - if 

        - switch ~ case문

반복문

        - for, while, do ~while



(2). for 문 원리를 살펴보겠습니다.

반복문의 순서는 a.초기화를 최초 1회 후 아래와 같은 순서로 계쏙 진행됩니다.

b->c->d->b(조건이참이면, 계속 진행)->c->d->b(조건이 거짓이면 for문 종료)



예제코드 

결과 

 <HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

   var i;

   for(i=1; i<=10 ; i++){

    

     document.write(i+"<br>");  

   }  

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

 




문제


1부터 20까지 짝수 합을 구하시오.

 예제코드

결과 

 

<HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

   var i, hap=0;

   for(i=2; i<=20 ; i+=2){

     hap=hap+i;

   

   }  

   document.write(hap +"<br>");  

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>


 





(3). while문 개념


while문도 for문과 같이 반복문입니다.

모든 for문과 while문은 치환이 가능합니다.



(4). while문 원리


while(조건){


   수행문...


} 



조건이 참이면 수행문을 수행합니다.

조건이 거짓이면, 수행문을 수행하지않고 while문 종료합니다.



 예제코드 입니다.

결과 화면 입니다.

 <HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var  cnt = 1;         

    while(cnt <= 5){     

      document.write("Nice !" +"<br>");

      cnt += 1 ;      

 }            

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

 



(5). do~while문 개념




do{


   수행문...


} while(조건)



일단 수행문은 무조건 1회 실행됩니다.

그 이후 조건이 참이면 또한번 수행문을 실행하고, 

또 조건을 따져서 참이면 수행문실행, 거짓이면 while문 종료 됩니다.



예제코드 입니다.

결과 입니다.

 <HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var cnt = 1;         

    do{     

      document.write("Nice !" +"<br>");

      cnt += 1 ;      

    }while(cnt <= 5);         

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

 





(6). while과 do~while의 차이.



가장 큰차이점입니다. 처음부터 조건을 따지느냐, 일단 최소 1회는 수행문을 시작하느냐가 다릅니다.



문제


1에서 10까지의 수 중 홀수의 합을 구하시오.

(단, do~while문을 이용하시오.)


=> 구독자 스스로 해보시기 바랍니다. :)



문제코드답 

결과 

 

 



정독해주셔서 감사합니다. :)


안녕하세요 풀스택 개발자를 꿈꾸는 진쓰입니다.

자바스크립트 3장 - 제어문 1(if, switch) 포스팅 시작하겠습니다.


목 차

(1). if 문

(2). if ~ else 문

(3). if ~ else 문 if ~ else 문

(4). switch~ case 문

(5). switch ~ case 문의 flow

 



포스팅에 앞서 잡설 하겠습니다.


프로그래밍을하다보면 수많은 조건, 상황, 예외에 따라 실행을 각기 다르게 해줘야할 필요가있습니다.

이럴때 제어문을 써야하는데요.

제어문은 자바스크립트 뿐만 아니라 수많은 프로그래밍 언어에서도 같은 맥락으로 사용되고있습니다.

이번 포스팅으로 제어문을 배워보도록 하겠습니다.


(1). if 문

제어문 : 프로그램이 흐름을 제어할 때 사용되는 구문입니다.


제어문의 종류: 

비교문, 반복문이 있습니다.


if문 시리즈

if ~

if ~ else

if ~ else if ~ else





if 문 예제를 살펴보겠습니다.

먼저 if문의 구조입니다.


 if( 조건식 ) {

  실행문

  .....

}



조건식이 참 - 실행문을 합니다.

조건식 거짓 - if문 탈출 합니다.



 예제코드 입니다.

 결과 입니다.

 <html>

<head><title> </title>

<script language="javascript">

<!--

A = 300;

B = 5 ;

document.write("자바스크립트 예제"+"<br>");

if(A>B){

  document.write( A + "값이 더 큽니다");

}

//-->

</script>

</head>

<body>

</body>

</html>

 



.



(2). if  ~  else 문


 if( 조건식 ) {

  실행문1;

  .....

 }

 else {

  실행문2;

}



 

조건식이 참 - 실행문1 실행 합니다.

조건식이 거짓 - 실행문2 실행 합니다.



 예제코드 입니다.

결과 입니다.

 <html>

<head><title> </title>

<script language="javascript">

<!--

A = 10;

B = 30 ;

document.write("자바스크립트 예제"+"<br>");

if(A>B){

  document.write( A + "값이 더 큽니다");

}

else

{

  document.write( B + "값이 더 큽니다");

}

//-->

</script>

</head>

<body>

</body>

</html>

 






(3). if ~ else 문 if ~ else 문



-조건이 여러 개인 경우 else if 사용합니다.


-else if문은 여러 개 나올 수 있다.


-더 이상 조건을 나열하지 않고 그 외의 것을 명시하고자할때 else 실행문을 실행하게 된다.




if(조건1){

      실행문1 ;

else if(조건2)

     실행문2 ;

else if(조건3)

     실행문3;

.....

else 

    실행문 x;

}

 



조건1을 만족하면 실행문1을 실행합니다.

조건2를 만족하면 실행문2를 실행합니다.

조건3을 만족하면 실행문3을 실행합니다.

위 의 모든 조건을 만족하지 않으면 실행문 x을 실행합니다.



 예제코드 입니다.

결과 입니다.

 <HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!-- 

var score;

score = prompt("점수를 입력해 주십시오."); //유저로부터 점수입력받음

if (score >= 90)

{

document.write("A학점 입니다.");

}

else if (score >= 80)

{

document.write ("B학점 입니다.");

}

else if (score >= 70)

{

document.write ("C학점 입니다.");

}

else if (score >= 60)

{

document.write ("D학점 입니다.");

}

else

{

document.write ("F학점 입니다.");

}

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

 

위 예제에서는 85점입력했을때 결과화면


(4) Switch ~ case 문


switch(변수 혹은 수식){


  case 값1:

       수행문1;

       break;

  case 값2

        수행문2;

        break;

  default :

       수행문3;

}





switch문의 뼈대라하면, case, 값, break 이렇게 따라오는데 특히, case와 break는 switch문의 예약어로 쓰이기도 합니다. 

특히 break는 반복문을 빠져나오는 예약어이기도 하죠.


아무튼, 변수 혹은 수식, 에 맞게 "값"으로 분기를하고 "break"를 만나면 case문은 종료하게됩니다.


가끔 프로그래머는 의도적으로 "break"문을 빠트려서, 여러 case 값: 구문들이 실행되게 하는 경우도 있습니다. 

아래 유튜브 강의를 보시면 예제를 보실수있습니다.



 예제코드 입니다.

결과 입니다.

 <HTML>

<HEAD>

<TITLE>Java Script Program</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

   var Num;

   Num= prompt("번호를 입력해주세요! 혹은 알파벳을 입력해주세요.");

     

   switch(Num){

       case "1" :

               document.write(“1를 선택하셨습니다." ); break;

       case "2" :

               document.write(“2을 선택하셨습니다." ); break;

       case "3" :

               document.write(“3을 선택하셨습니다." ); break;

       case "4" :

               document.write(“4를 선택하셨습니다." ); break;

       default :

               document.write("번호를 잘못 누르셨습니다." );

   } // switch문을 닫아줌

// -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

 

위 예제에서는 3을 입력했을때 결과화면 입니다.


3을 입력하면 case "3" 이하의 구문을 실행하고 break를 만나서 case문을 탈출하게 되죠.



정독해주셔서 늘 감사합니다. :)

아래는 유튜브 강의영상입니다.




+ Recent posts