마른하늘에날벼락처럼내려치는코딩

1. 객체 생성자 함수

- 객체 구조를 선언하고 객체화 하는 방식

- new 연산자를 활용하여 구조체를 객체화

- 동일한 구조를 가지고 여러번 객체화를 해야 할 경우 사용

- 함수 내부에서 선언된 var, let 키워드는 지역변수(외부에서 접근 불가)

- 함수 내부에서 선언된 this 키워드 활용

​

1) 객체 생성자 함수 선언

- 파스칼 표기법으로 함수명을 지어준다.

- 일반 함수 선언과 동일하며, 내부에 this 키워드가 있다.

​

2) 객체 생성자 함수를 활용하여 필드 보호하기

​

3) 객체생성자 함수 실습

​

실습1. 학생의 정보를 담을 수 있는 객체 생성자 함수 선언하고 객체화를 시켜라

1. addStudent 메서드 실행시 학생 정보를 저장(학생나이, 학생명)

2. getStudent 메서드 실행시 저장된 학생 정보 전체 가지고 오기

3. 객체화된 외부에서는 학생정보가 담긴 필드는 접근이 불가해야한다.

​

실습2. 차가 3대가 있다. 3대의 이동거리를 누적 시킬 수 있는 객체 생성자 함수를 선언하고 객체화 시켜

각 차 3대를 이동 시키고 누적이동거리를 출력시켜라.

>>> 주석처리부분을 잘보자!!

>>> new를 선언해줄시 자동으로 객체화되어 객체로 변환된 후 출력된다.

>>> js에서는 따로 객체를 메서드를 생성하지않아도 사용자가 도트연산자를 통해서 호출할 시

자동으로 생성해준다.

​

​

75.객체 생성자 함수 상속(prototype)

- 객체 생성자 함수 원형에 메서드를 추가할 수 있다.

- 이미 객체화 된 대상에 메서드를 추가하지 않아도 prototype으로 추가된 메서드를 사용 할 수 있다.

- 이미 객체화된 대상에 확장

- prototype 사용시 메모리를 절약할 수 있다.

- prototype으로 추가된 내용은 객체화된 대상이 상속을 받는다.

​

1) prototype 예시

​

예시1)

​

예시2) 대표적인 prototype의 예시(push 메서드가 prototype으로 추가)

​

예시3) prototype으로 생성된 메서드의 this

​

예시4) 원형에는 데이터에 관련 필드나 메서드만 prototype 에는 기능에 관련된 메서드 실행

>>> indexOf 에서는 대입한 값에 해당하는 index번호를 반환하여 출력한다.

1. 객체(메서드)

- 메모리에 저장된 자료 구조

- 속성(상태, 값)과 기능(메서드)을 가지고 있다.

- 객체가 대입된 변수는 참조 변수라고 부른다.

- 키와 값 한 쌍으로 값 및 메서드 정의 가능({key : value})

​

1) 객체의 선언

​

▼ 값이 없는 객체 선언 방식

​

▼ 값이 있는 객체 선언 방식 및 접근방법

​

2) 객체에 값 대입하기

​

>>> 도트연산자(.)이나 [ ]를 이용하여 값을 대입할수 있음. 순서대로 출력되기때문에 obj05의 값이 이순신이였지만 이후에 대입된 고길동 값으로 변했다. (객체가 아닌 대상에는 도트연산자를 활용할 수 없다.)

​

3. this

- 메서드 내에서 사용되며, 객체 자신을 가리킨다.(메서드 밖에서는 사용 x)

>>> 해당 입력처럼 this.을 입력해주지않으면 오류가 발생한다.

​

4. 체이닝 기법

- 멤버 호출시 마지막에 나열된 멤버가 객체가 리턴이된다면 그 객체의 멤버를 호출 - 마지막에 도달된 값이 반환

>>> 메서드 내의 모든 객체에 도트 연산자를 이용해서 접근할 수 있다.

​

5. 객체 활용

>>> 출력결과 : 먼저 myObj 매서드의 addNum함수를 실행할때 인자로 10, 20, 30을 건내주면

addNum 함수에서 인수n에 해당 인자들을 받고 arr에 입력을하고 리턴을 한다. 그리고 console.log가

실행되는데 arr에 값이 입력되어있기때문에 해당 함수에 기입된 구문을 이행하여 위와같은 결과가 나온다.

​

6. 객체 실습문제

​

실습1.

>>> 출력결과 : student 메서드를 선언하면서 내부에 빈값을 가진 공간을 만들어줬다.

도트연산자를 이용해서 student안에 존재하는 공간에 값을 대입한다.

출력이 먼저실행됬기때문에 출력되지않지만 이후 객체에는 값이 담겨있다.

​

실습2. 회원의 이름을 저장 할 수 있는 필드, 회원 이름을 가지고 올 수 있는 메서드를 가진

객체를 생성하여라.

>>> 출력결과 : userName의 빈공간에있는 함수를 받고 리턴해주는 getUserName을

만들고 실행하였다.

​

실습3.

>>> 출력결과 : gugu객체에 함수와 숫자를받는 필드를 만들고 숫자를 받는필드에 숫자가 들어왔을때 함수로 전달해서 구구단을 출력할수 있도록 하였다.

​

실습4.

>>> 출력결과 : arr 배열 필드의 값을 getScore함수 필드에서 받아서 console.log실행부에 getScore

에 인자값을 보냈을때 그 인자값을 인수에 대입하여 학생의 점수를 받아내는 객체를 생성하였다.

​

실습5.

>>> 출력결과 : arrScore에 배열값을 대입받아서 그 배열값을 arr에 push해준다.

그이후 getAvg함수필드에서 배열의 합을구해서 평균을 리턴한다.

최고점수는 변수를 0으로 선언하여 그변수보다 큰값을 변수에 저장하는 방식으로 for문을 사용하여

최고값을 구하였고, 최저점수는 변수를 배열arr의 첫번째값으로 선언하여 해당값보다 작은값이 있으면

변수에 저장하는 방식으로 최고값을 구하였다. 그렇게 구한 최고값 최저값으로 학생명을 리턴해준다.

​

실습6. 자동차를 객체로 표현하여라.

(이동 -> 기능, 이동거리 -> 값)

(이동에 관련된 메서드 실행시 이동 거리값이 누적되도록)

​

실습7. 학생의 정보를 담을 수 있는 객체 선언

1. addStudent 메서드 실행시 학생 정보를 저장(학생나이, 학생명)

2. getStudent 메서드 실행시 저장된 학생 정보 전체 가지고 오기

​

1. 내부함수

- 함수 내부의 함수

- 지역 변수처럼 지역 함수이므로 외부에서 쓰일 수 없다.

1) 재귀 호출

- 함수 내부에서 자기 자신의 함수를 호출 하는 것

1. 외부에서 호출

2. 내부에서 나 자신 호출

​

********* 주의사항 *********

조건 처리를 하여 재귀호출을 특정 시점에 중단시켜주지않으면 무한루팅된다.

(if - return문을 사용하여 특정시점에 중단시켜줘야함.)

*************************

>>> 재귀함수 호출을 했을때 return이 아닌 단순 호출을하여 return값을 받지 못하고 undefined값이 나온다.

>>> 정상호출방법 ▼

​

2) 리턴 있는 재귀 호출

>>> fnA를 호출했을때 내부함수인 fnB, fnC를 거쳐 return값 10을 fnA함수가 받는다.

>>> fnCall을 호출했을때 내부함수로 본인 함수를 재귀호출하기때문에 fnCall의 인자값이 증가하다

if문을 만나서 n값이 11이 되는 시점에 return된다.

​

3) 재귀호출 실습

​

실습1. reFn 함수를 실행시 빈 배열 객체를 인수로 삽입하여 실행하였더니, 최종 리턴값이

1~5까지의 배열 요소가 담긴 배열이 리턴되었다. 위 조건대로 함수를 선언하고 실행하여

최종 리턴값을 출력하여라.

​

실습2. gugu함수 실행시 인수의 형태를 보고 최종 결과물이 나올 수 있도록 재귀 호출 함수를 완성하여라.

​

실습3. ranArray 함수 실행시 숫자가 중복되지 않는 6개의 요소를 가진 배열이 리턴이 되었다.

위 조건대로 함수를 선언하고, 실행하여 결과값을 출력하여라.

>>> arr[i] 값이 ran의 값과 같으면 다시 재귀함수 호출하고, 다를때만 ran값을 입력하여 중복값 배제

​

2. 콜백함수

- 이벤트 및 특정 시점으로 인해 후에 시작되는 함수

- 주로 비동기 방식이다.

- 후에 시작되는 함수는 매개변수로 데이터를 받을 수 있다.

- 기존의 코드는 위에서 아래로 실행이되거나, 반복문 종료 후 아래의 코드가 실행되는 형태이나,

setTimeout 이라는 내장함수를 통해서 시점을 정한 후 정한 시점이 지난 후에 실행된다.

(꼭 setTimeout 함수를 사용하지 않아도 특정 이벤트 발생시점을 기점으로 콜백함수를 사용할 수 있다.)

​

>>> 특정 이벤트 예제 ▼

>>> 콘솔 출력 결과 : 처음에 console.log를 실행하였을때는 myName 문자열이 공백상태이기 때문에

아무런 출력도 되지않지만, 만들어놓은 버튼을 클릭하였을때 myEv함수의 인수 msg에 인자값으로 홍길동

문자열을 전달해주기 때문에 버튼을 클릭했을때 홍길동이 출력된다.

​

​

1) setTimeout 함수

- 1번째 인수 : 함수

- 2번째 인수 : 숫자(시간)

- 2번째 인수에 해당하는 시간 후에 1번째 인수의 함수 실행

>>> 콘솔 출력 결과 : 코드 실행 종료 --> 순차적으로 실행되기 때문에 바로 실행됨.

: 3초후 실행 --> 순차적으로 실행된 후 setTimeout에서 지정한 3초의 시간이 지난뒤 실행.

>>> 콘솔 출력 결과 : 순차적으로 실행이되기때문에 1번째 console.log인 for문이 먼저 실행이되고

setTimeout 함수를 지나서 3번째 console.log를 실행한다.이때 for문은 종료된 후이기 때문에 전역변수값인 cnt=0값을 출력하고, 이후에 setTimeout함수에서 지정한 시간인 1초후에 순차적으로 for문의 반복이 끝날때

까지 출력한다.

​

***** 인자로 함수를 받는 이유 *****

>> 함수 내부에서 실행 시점이 언제인지를 모르기 때문에

함수에 코드를 저장했다가 시점 발동시 해당 인자로 들어온 함수를 실행

***************************

​

>>> 콘솔 출력 결과 : 순차적으로 실행하면 myFn 일반함수를 선언하고 mfn 익명함수를 선언한다.

이후 myFn함수의 인자값으로 mfn함수를 myFn함수의 인수인 fn에 대입한다.

이때 fn은 함수값을 받아서 함수이기때문에 인자에 1을 대입하여 실행하면 mfn 함수에 1을 대입한

myFn 1값이 출력된다. 이후 myFn함수의 인자값을 함수로 다시한번 실행해서 fn의 값에 함수의 값인

다른코드 가 출력된다.

​

>>> 콘솔 출력 결과 : 순차적으로 실행했을때 callFn01 함수는 setTimeout으로 시점이 5초후 출력으로 정해졌기 때문에 userName 문자열에 홍길동이 대입되지 못하고 순차적 실행 이 출력된다. 그리고 5초 후에 callFn01 함수의 인수인 fn에 인자로 함수가 삽입되어서 fn은 함수가되고, fn의 인자값에 홍길동을 대입하여 실행했을때 인자로 삽입한 함수의 name 인수에 fn의 인자값인 홍길동을 대입하여 console.log를 실행하여 홍길동 콜백 데이터

가 출력된다.

​

2) 콜백함수 실습

​

실습1.

>>> 콘솔 출력 결과 : windowPrint 함수의 인자값으로 첫번째로는 함수, 두번째로는 문자열 '안녕하세요'를

대입할때, 첫번째 인수 fn에는 함수가, 두번째 인수 str에는 문자열이 대입된다.

지역변수 time=2000으로 선언해줫을때 setTimeout함수에서 지정한시간(time) 이후에

document.write에 인수 str에 대입된 값인 '안녕하세요'를 대입하여 문서창에 작성하고 이후에 인수 fn은 인자값으로 함수를 받았기때문에 실행이 가능해져서 지역변수로 선언한 time을 대입하여 인자값으로 주어진 함수를 실행한다.

​

실습2.

>>> 콘솔 출력 결과 : myFn함수를 실행할때 인자값으로 함수를 전달해주고 실행하면 인수n은 함수가되어 실행할 수 있다. 이때 n함수의 인자값으로 안녕하세요를 대입해서 실행하면 전달된 인자값인 함수를 실행할때 n함수의 인자값을 대입하여 실행한다.

​

실습3.

>>> 콘솔 출력 결과 : numPrint 함수를 실행할때 첫번째 인수인 fn에는 함수를 대입하고,두번째 인수인 n에는

숫자 100을 대입한다. 그리고 setTimeout 함수에서 지정한 시간 이후에 인자값으로 함수를 받은 인수 fn을 실행하고 그때 인자값으로 전에 인자값으로 받은 n(100)을 대입하여 실행한다.

​

실습4.

>>> 콘솔 출력 결과 : 아래 배열의 값의 합(150)을 결과물로 받고자한다. 이때 myArray함수의 첫번째인수인 fn

에는 함수, 두번째 인수인 arr에는 배열의 값을 인자로 전달하고, 실행하였을때 setTimeout에서 지정한 시간이

지난 후에 지역변수로 선언한 sum이 for문을 만나서 arr배열의 합의 값을 가지게 되고, 이때 인자로 함수를 받은

인수 fn을 실행할때 인자 값으로 sum을 대입하여 실행하면 인자값으로 받은 함수가 실행된다.

​

3. 크로져

- 실행되는 함수의 주위 환경을 기억하는 것

>> 지역변수는 외부에서 접근이 불가하기때문에 n1의 값을 return할때 fn을 실행하였을때는 접근이 불가했으나,

한번더 fn의 주소값을 변수로 선언하여 접근할때는 접근이 가능하다. 이유는 이미 fn에서 한번 접근을 시도했을때

주변의 환경을 기억하기때문에 이후에는 접근이 가능한 것

​

>> 순차적으로 실행해서 마지막줄의 console로그가 실행되는데, 반복문 밖에서 실행되어서 이미 i값은 10으로

갱신되어 i값인 10을 받는다. setTimeout함수에서 실행되는 console.log구문또한 for문이 끝나서 i값이 10으로

갱신된 상태이기때문에 반복은 하지만 i의 값은 전부 10으로 출력된다.

>> 그러나 이렇게 함수로 감싸준 뒤 반복문이 실행할때마다 myN함수를 실행시켜주면 원하는대로 정상출력된다.

>> 이렇게 익명함수의 마지막부분에 (인수)를 삽입하면 익명함수가 바로실행되기 때문에 setTimeout함수가

지정한 시점에 실행되도 원하는 값을 얻을 수 있다.

- 메모리에 코드를 저장하는 수단

- function 키워드로 함수를 선언

- 함수는 선언 후에 실행 해야 저장된 코드가 실행 된다.

- 함수에는 익명함수와 일반함수가 있다.

- 함수는 지역변수와 전역변수 차별이 확실하다.

​

1) 함수 선언

- 일반 함수 구문 : function 함수명 ( ){ }

- 익명 함수 구문 : var 함수명 = function( ){ }

​

1-1) 일반함수

- 이름이 있는 함수

- 일반 함수는 선언 위치에 상관 없이 호출이 가능. (호이스팅 기술사용 가능)

​

▼ 해당 형식으로 사용

*** 호이스팅기술 : 선언이 어느위치에 되어있건 선언할때 정보를 메모리에 담아놓고 호출시에 가져다 사용 ***

​

1-2) 익명함수

- 이름이 없는 함수

- 단독으로 선언 불가능, 대입을 해줘야 선언 가능. (변수, 매개변수)

- 호출부 위에 선언이 있어야 정상 작동 한다. (순서상 : 선언 -> 호출 / 호이스팅 기술사용 불가)

​

▼ 해당 형식으로 사용

​

2) 함수 호출

- 선언된 일반 함수 -> 함수명();

- 익명함수 -> 대입된 변수명();

​

3) 함수를 변수에 대입하기

- 함수를 실행하지 않고 호출시 함수 코드를 가지고 온다.

- 함수 코드를 다른 변수에 저장 가능하다.

​

3-1) 함수를 변수에 대입

​

3-2) 함수를 매개변수에 대입

​

4) 매개변수

- 함수명(매개변수....) -> 함수 호출시 인수를 넣어 인자값을 받을 수 있는 수단

- 함수 호출 -> 함수명(인수1, 인수2...) -> 함수 매개변수(인자1, 인자2...)

***** 인수, 인자 *****

인수 : 함수명(인수명)의 형태로 선언되며 사용자가 입력한 인자 값을 받는 매개변수

인자 : 사용자가 입력하는 값으로 인수에 대입됨

******************

​

​

5) 함수 작성 및 호출 실습

​

실습1. myPrint라는 함수를 호출 하였더니 콘솔창에 '안녕하세요.' 라는 문구가 출력이 되었다.<br>

위의 구문대로 작동할 수 있도록 함수선언과 호출을 하여라.

​

실습2. 아래의 코드가 정상 작동할 수 있도록 ????? 부분을 작성 하여라.

​

​

실습3. myFn01 함수를 실행 시켰더니 'ksmart.or.kr'이라는 문구가 출력이 되었다.<br>

위의 구문대로 작동할 수 있도록 함수선언과 호출을 하여라.

​

1) 새로운 함수를 생성하는 방법

​

2) 함수 호출시 인수로 함수코드를 전달하는 방법

​

실습4. gugu01함수를 인수에 2를 넣어서 실행시겼더니 구구단 2단이 출력이 되었다.

위의 구문대로 작동할 수 있도록 함수선언과 호출을 하여라.

​

실습5. myAvg 함수를 실행하면서 해당 숫자가 담긴 배열을 인자로 받아 평균값을 구하고 그 평균값만 출력시키도록 하여라. >>> ([10,20,30,40,50])

​

실습6. zoneCount라는 함수를 실행하면서 지역정보를 담은 배열과, 배열요소를 검색할 문자열을<br>

인수로 넘기고 실행을 하면, 첫번째 인자(배열)의 요소를 검색하여 2번째 인자와 동일한 값을 카운팅 하고 <br>

그 결과값을 출력시키도록 하여라.

​

실습7. arrSearchCount 함수를 실행하면서 아래의 2개의 배열을 인수에 삽입하여 실행하고,

2 배열의 인자에서 동일한 데이터(요소)를 카운팅하여 출력하여라.

​

>>>>>> 함수는 어떤값을 대입해도 원하는 결과값이 나오도록 만들어줘야한다. 입력값을 지역변수로 선언해주면 인수에 어떤값을 대입하여 실행 하더라도 같은결과가 나오기때문에 이에 유의하며 작성해준다. <<<<<<

​

********** 지역변수와 전역변수 **********

***********************************

​

53. 함수의 return

- 함수 내부에서 쓰이는 키워드

- 함수를 종료시킨다.

- 호출한 곳에 값을 전달한다.

​

1) return - 함수 종료

​

2) return - 호출한 곳으로 값 전달

​

3) return 활용 실습

​

****** return의 호출방식 ******

1. console.log(함수명(인자));

2. 변수를 선언하여 함수의 주소값 대입 후 console.log(변수명);

**************************

​

실습1. sumArray라는 함수 호출시 인수로 숫자가 담긴 배열을 삽입하여 호출 할 것이다.

배열의 합산 값을 구하여 그 합산값을 출력하도록 하여라.(return 활용)

​

실습2. reArray(arr, n) -> arr의 요소가 n보다 크면 그 값을 리턴하고 함수 종료

​

실습3. guguArray(n) -> n 숫자형 -> return = n 단의 구구단의 값을 담은 배열을 출력하는 함수

​

1) index값에 접근하여 값을 저장하고 반환

​

2) push를 사용하여 값을 저장하고 반환

​

- 하나의 저장소에 여러 데이터를 저장할 수 있는 방법(객체)

- 배열에는 index가 존재 -> 배열 객체에 데이터가 저장되는 주소

- index -> 주소 0 부터 시작 -> 데이터가 저장될때마다 주소가 1씩 증가

- 배열 객체에 index를 활용하여 데이터를 저장하거나 가지고 올 수 있다.

- 배열에는 기본 자료형, 객체, 함수를 담을 수 있다.

​

1) 배열 객체 선언

- var 식별자(변수명) = new Array( );

( [] 형태의 공간(객체) 생성 -> 식별자에 공간(객체)의 주소를 대입 )

- var 식별자(변수명) = [ ];

​

2) 배열의 요소(원소) 접근하기

- 배열이 가지고 있는 데이터(자료형)

- 배열의 요소는 index로 접근 해야한다.

- 배열의 요소에 값을 변경하거나 제거하려면 index로 요소에 접근해야한다.

- 배열의 요소 생성은 index로 접근하여 생성(저장)한다.

- 요소 접근 방식 -> 식별자[index]

- 요소에 값 저장 -> 식별자[index] = 값;

- 객체는 매서드(기능)과 속성으로 구성이 되어있다.

- 객체의 속성이나 메서드에 접근하기 위해서는 도트 연산자(멤버 호출 연산자)를 활용한다.

(식별자.속성 혹은 메서드)

​

3) 배열에 값 저장하기

​

4) 배열의 크기(배열에 담긴 갯수)

- 배열의 크기를 알아 보기 위해서는 length라는 속성을 사용한다.

5) 배열과 반복문

​

5-1) 배열과 반복문 실습

​

실습1. 구구단 2단의 결과값을 guguArray 배열에 담도록 하여라

​

실습2. [45,60,88,90,100] --> 해당자료는 한 학생의 점수이다. 해당학생의 점수의 평균을 구하여라

​

실습3. [66,43,45,75,40] --> 해당자료는 학생들의 평균이다. 평균이 50이상인 학생의 수를 구하여라

​

*************** 객체 참조 변수 ***************

​

1. 기본형

2. 참조형

​

>>>>>>>>> 기본적으로 사용하던 변수선언 형태는 해당 자료의 값을 가지고 사용했지만, 배열(참조형변수)에서는 자료가 저장된 주소의 주소값을 사용하기때문에 값 수정으로 다른자료의 값까지 수정된다.

1) break

- 주로 반복문 안에서 사용된다.

- break를 만났을 경우에 반복을 중단하고 아래의 코드는 실행하지 않는다.

​

1-1) break 실행 예시

​

2) continue

- 반복문 안에서만 사용된다.

- continue를 만났을 경우 continue 아래의 코드를 실행하지 않고 다음 반복을 실행한다.

​

2-1) continue 실행 예시

​

3) switch

- 하나의 값 기준으로 여러값을 비교할때 쓰이는 제어문

​

3-1) switch 실행 예시 (switch문 자동완성기능 사용시 switch/case/break/default 부분까지 자동완성됨)

- 조건식의 결과값이 true일 경우 스코프 영역 코드가 실행

- 스코프 영역 실행 이후 다시 조건 비교 -> true일 경우 다시 스코프 영역 실행

​

1) while문

- 조건식이 true일 경우 스코프 영역 코드 실행

- 실행 이후 다시 조건 비교

1-1) while문 실습

​

1. 구구단 출력/역순 출력

​

2. 숫자 합산 결과값 출력

​

3. 숫자 짝수의 합산 값 출력(나머지연산자% 사용)

​

​

2) for문

- 초기값, 조건식, 증감식 한번에 작성

- for(초기값; 조건식; 증감식){ } 형태로 작성

- 조건식이 true일시 계속 반복

2-1) for문 실습

​

1. 구구단 출력, 역순출력

2. 숫자의 합산 및 결과값 출력(3의배수, 5의배수만)

3) 동일 문제로 while문과 for문 작성 비교

​

for문 - 숫자의 증감을 이용한 문자열 출력(문자열 대입 연산자)

while문 - 숫자의 증감을 이용한 문자열 출력(문자열 대입 연산자)

▶ 출력부분의 위치를 달리하면 초기값을 다르게 설정하여도 같은 값이 나온다.

​

****주의할 부분****

1. 조건식이 반복진행될시 false값이 나오도록 설정해줘야한다(무한반복시 에러발생)

2. 조건식 설정시 대입 연산자'='와, 비교 연산자 '=='를 정확히 구분해서 작성해야한다

(비교연산자를 작성해야할 조건식에 대입연산자 대입시 false가 나와야할 값이 true로 출력될 수 있다.)

​

***추가실습***

실습 1. 구구단 2단부터 9단까지 출력

​

실습2.

------

-////-

-////-

------

위 모양을 콘솔창에 출력하여라.

빗금친 부분은 모두 공백으로 출력.

1) 실행 예시

>>> 선행된 반복문의 1반복이 실행될때 중첩된 반복문이 모두실행되고 다시 선행된 반복문의 2반복 실행 ··· n반복

​

2) 중첩 반복문 실습

​

실습1. 구구단 2단부터 9단까지 출력하라

​

실습2. 구구단 9단부터 2단까지 역순 출력하라

​

실습3. 구구단 2단부터 9단까지 값중 짝수의 값만 합산하여 합산값만 출력하라

​

실습4. 구구단 2단부터 9단 중 홀수 단만 출력하도록 하여라

​

실습5. 중첩 반복문을 활용하여 아래의 문자열이 차례대로 콘솔에 출력되도록 하여라.

00

101

2012

30123

401234

​

1) 연산자

- 결과값 = 식별자 연산자 식별자

- 피연산자 -> 값

- 연산자 -> 피연산자들을 계산(처리)하기위한 수단(기호)

​

2)산술연산자

- 더하기(+), 빼기(-), 곱하기(*), 나누기(/), 나머지(%)

(**나머지 연산자(%) : 두 피연산자들 끼리 나누어 남은 값)

​

3) 문자결합 연산자

- 문자형끼리 결합 시킬때 사용되는 연산자이며, 산술연산자의 더하기와 기호는 동일하다.

- 문자형 피연산자와 다른형의 피연산자끼리 결합이되면 결과값의 연산자는 문자형이 된다.

- 숫자형태를 가진 문자열을 산술 연산을 하려고 할때 주의(문자형의 숫자값을 -> 숫자형으로 변환 후 연산)

** 문자형의 숫자데이터 연산시**

- html 요소에서 숫자값을 가지고 오게되면 문자형의 숫자값으로 가지고 오게된다.

- 통신후에 결과값은 숫자형태의 문자형으로 가지고 오게된다.

- Number() 혹은 parseInt()를 활용하여 숫자형으로 변환 후 연산처리

​

4) 대입 연산자

- 대입연산자(=) -> 식별자 = 피연산자 + 피연산자;

- 산술연산자와 대입연산자를 결합시켜 쓰는 방식 (+=, -=, *=, /=, %=)

- 식별자a += 식별자b(피연산자) -> 식별자a = 식별자a + 식별자b(피연산자)

​

5) 증감 연산자

- 숫자형에만 해당

- 증감연산자 : (++),(--) 기호로 숫자형에 1씩 증가 또는 1씩 감소 시킨다.

- (++),(--) 기호는 식별자(변수) 앞이나 뒤에 올 수 있다.

- 증감 연산자로 연산처리 후 그 값을 대입할 쓰일 경우 증감 연산자의 위치에 따라 대입된 결과값이 달라진다.

- (++) -> 1씩 증가, (--) -> 1씩 감소

- 식별자(++ 혹은 --) -> 후 증가 혹은 후 감소

- (++ 혹은 --)식별자 -> 선 증가 혹은 선 감소

​

6) 비교 연산자

- 두 피연산자를 비교하여 참이면 true, 거짓이면 false의 boolean형 결과값 반환

- 비교 -> 같다(==), 같지않다(!=), a > b, a < b, a >= b, a <= b

- 자료형과 같이 비교하는 비교 연산자 -> 자료형과 값이 같다(===), 자료형과 값이 같지 않다(!==)

- 조건식 -> 비교연산자와 논리연산자를 활용하여 그 결고값이 boolean형 결과값이 나오도록

- a > b, a < b, a >= b, a <= b -> 숫자형에서만 활용

​

7) 논리 연산자

- 2개 이상의 논리형 값이 모두 참(true)이거나, 혹은 하나라도 참(true)을 비교하는 연산자

- and(&&) -> 모두참일시 : true

- or(||) -> 하나라도 참일시 : true

- not(!) -> not 연산자 (결과값의 반대) -> true라면 결과값 false, false라면 결과값 true

***** 연산순서 : 산술 연산자 -> 비교 연산자 -> 논리 연산자 *****