Practice makes perfect

이벤트(Event)

: 이벤트는 간단하게 사용자의 어떠한 동작에 따라 기능이 실행되는 것을 의미합니다. 이벤트는 이벤트 대상, 이벤트 종류, 이벤트가 발생했을 때 실행되는 함수, 이 3가지로 구성되어 있습니다. 이벤트 대상은 특정 태그를 의미하고 이벤트의 종류는 click, drag, onmouse 등 여러 가지 종류가 있습니다.

1. window 객체의 load 이벤트 

load : 이벤트 이름 or 이벤트 타입
onload : 이벤트 속성
이벤트 핸들러 or 리스너 : 이벤트 속성에 할당된 함수
이벤트 모델 : 문서 객체에 이벤트 연결하는 방법
이벤트 연결 : window 객체의 onload 속성에 함수 자료형을 할당하는 것

* document - html의 명령어에 접근할 수 있는 태그의 느낌으로 알고 있으면 됩니다. 

<출력값>

header 에 onclick(이벤트 속성)을 연결 = 클릭하는 순간 이벤트 발생(whenClick)

2. 고전 이벤트 모델 

이벤트 속성을 이용해 이벤트 연결하고 자바스크립트에서 문서 객체의 이벤트 속성을 사용해 이벤트를 연결하는 방법으로 이벤트 하나에 핸들러 하나만 연결할 수 있습니다. 

이벤트 해제의 방법 = null 을 넣으면 한번만 수행되고 수행되지 안습니다. 

<출력값>

null  값을 넣어주므로 click 선택했을 때 한번만 수행되어집니다. 

2.1 이벤트 발생 객체와 이벤트 객체 

counterA.innerHTML (=) 없이 단독으로 사용할 때, 현재 text에 있는 값을 읽어옵니다. 

<출력값>

2.2 이벤트 객체 사용 

이벤트 객체 내용 출력하는 예제

var event = e || window.event; 

e가 존재하면 e를 변수 event에 넣고, e가 undefined이면 window.event 속성을 변수 event에 넣음

인터넷익스플로러 8 이하 버전 
이벤트가 발생시 이벤트 객체 window.event 속성으로 전달
다른 브라우저는 이벤트핸들러의 매개 변수로 전달

- 8버전 이하는 함수의 (e) 를 event 에 전달 x , || windo .event를 넣음으로써 어떤 버전이든 수행될 수 있도록 합니다. 

3. 인라인 이벤트 모델 

- HTML 페이지의 가장 기본적인 이벤트 연결 방법.

- 태그 안에서 연결하는 방법으로 간단한 코드의 기능일 때 유효하며,  코드가 길어도 script 안에서 명시하고 이름으로만 추력 가능합니다. 그래서 3번째 방법을 제일 많이 사용합니다. 

<출력값> 

- InClick1 클릭

- InClick2 클릭

4. 기본 이벤트 제거 

기본 이벤트
일부 HTML 태그는 이미 이벤트 핸들러 가지고 있음
입력 양식의 경우 제거하는 방법

onsubmit 함수는 원래 무조건 서버로 전달하는 이벤트 이지만

return false;  - 서버로 전달하지 않습니다. 

return true; - 서버로 전달합니다. 

<출력값>

- 비밀번호 일치 

- 비밀번호 불일치

인라인 이벤트 모델의 이벤트 제거

태그에 직접적으로 연결

<출력값>

- 비밀번호 일치 

- 비밀번호 불일치

5. 이벤트 전달 

이벤트 버블링 방식이 일반적  : 자식노드 -> 부모 노드 순으로 이벤트 실행 (대부분)
이벤트 캡쳐링  : 이벤트가 부모 노드 -> 자식 노드 순으로 실행되는 것 (8버전 이하)

자식에서 발생된 이벤트를 부모에게 전달합니다. 

- 단, 자식에서 시작된 이벤트가 부모에서는 이벤트를 수행하고 싶지 않을 때 문제가 될 수 있습니다. 

6. 이벤트 전달 막기 예제

8버전 이하 : event.cancleBubble = true

대부분 : event.stopPropagation 

위의 코드는 어떤 버전이든 수용가능하게 하는 코드입니다. 

문서객체모델(DOM, Document Object Model)

- 넓은 의미 : 웹브라우저가 HTML 페이지를 인식하는 방식
- 좁은 의미 : document(body를 관리) 객체와 관련된 객체의 집합
- HTML 페이지에 태그를 추가, 수정, 제거할 수 있음

- 기본적인 자바스크립트만으로 DOM을 다루기에는 너무 복잡하므로, 간단한 내용만 살펴보고 자세한 내용은 jQuery와 함께 사용

DOM 관련 용어

- 문서 객체 : html or body 태그를 자바스크립트에서 이용할 수 있는 객체로 만들면 그것이 문서 객체.

- 노드 : 각 요소(head, body, title, script, h1, HEADER ...)

   1) 요소노드(Element Node):HTML 태그.
   2) 텍스트노드(Text Node) : 요소노드 안에 들어 있는 글자.

- 정적으로 문서 객체를 생성한다의 의미
: 웹페이지가 처음 HTML 페이지에 적혀있는 태그들을 읽으며 생성하는 것.

- 동적으로 문서 객체를 생성한다의 의미
: 자바스크립트를 사용해 원래 HTML 페이지에는 없는 문서 객체를 생성하는 것.

- document : body를 관리

- document의 객체를 통해서  css의 선택자 처럼 사용된다.   
- css, html의 태그를 javasctript의 노드라고 부른다. 

문서 객체 생성1

<출력값>  

<h2> Hello DOM</h2> 를 생성하여 출력합니다. 

window.onload = function(){} 안에 작성하는 이유:
boby 영역이 먼저 브라우저로 넘어간 이후에 실행되는데, 안에 들어있지 않으면 실행하는 순간  먼저 실행되지만 body 영역에 아무것도 올라가 있지 않기 때문에 error가 납니다. 결과적으로 boby 영역이 실행되어야지 함수가 적용되기 때문에 꼭 안에 넣어줘야 합니다. 

- window.onload = function(){} 는 한개만 등록해서 사용가능합니다. 여러개 등록되어 있으면 마지막에 입력한 데이터만 출력합니다. 

문서 객체 생성2

텍스트 노드 갖지 않는 노드 생성하는 방법

1) 웹표준이 정의하거나 웹브라우저가 지원하는 태그의 속성에만 사용

<출력값>  

속성이 있는 경우 = ( . ) 을 이용해서 동작 되어집니다. 

2) 웹브라우저가 지원하지 않는 속성(사용자 속성 추가)

( . ) 을 이용하여 지원 되지 않으므로, setAttribute()를 이용하여 적용할 수 있습니다. 

<출력값>  

직접 적용한 속성이 들어갑니다. 

문서 객체 생성3 

문서 객체의 innerHTML 속성 사용해 객체 생성.

-  innerHTML : 오른쪽의 값을 그대로 boby 영역 안에 추가

<출력값>  

문서 객체 가져오기1 

- 웹페이지에 이미 존재하는 HTML 태그를 자바스크립트로 가져오는 방법.
- getElementById() 메서드는 한 번에 한가지 문서 객체만 가져올 수 있습니다(제한적 사용) 

<출력값>  

문서 객체 가져오기2

- 아이디 속성으로만 가져올 수 있는 것이 아닙니다. 

getElementsByTagName('tagName')  : tagName과 일치하는 문서 객체를 배열로 가져옴
getElementsByName(name)  : 태그의 name 속성이 name과 일치하는 문서 객체를 배열로 가져옴

getElementsByClassName('className') : className 과 일치하는 문서 객체를 배열로 가져옴

* 인덱스를 통해서 접근하는데 시작값 = 0 입니다. 

<출력값> - tag의 인텍스를 통해서 출력 

문서 객체의 스타일 조작

<출력값> - 스타일 적용

문서 객체 제거 

방법1 : body 문서 객체 바로 아래에 제거하고자 하는 문서객체가 있을 때 가능한 코드

- body 객체 바로 알에 있어야지만 가능하므로 제한적입니다. 

<출력값> - h1 제거 

방법2 : 일반적으로 문서 객체를 제거 할 때 사용하는 코드

대상. parentNode.removeChild() 를 통해서 제거 

<출력값> - h2 제거

문서객체를 활용한 예제 

<출력값> - 동적으로 시간이 변경

- setInterval : 1초마다 함수를 불러옴. 

 객체 

: 객체는 관련된 데이터와 함수(일반적으로 여러 데이터와 함수로 이루어지는데, 객체 안에 있을 때는 보통 프로퍼티와 메소드라고 부릅니다)의 집합입니다. 

1. 객체의 생성 - 키:요소 

{ } (소괄호) 사이에 데이터를 key - value 로 넣음. 

2. 객체의 속성과 메서드 

속성 : 객체 내부에 있는 하나하나의 값.

- 객체의 속성이 가질 수 있는 자료형 - 

- 속성과 메서드의 구분 ( 변수 선언)

key ; value 로 저장하여 접근할 수 있도록 합니다. 

- this 키워드:자바스크립트는 this 키워드를 생략할 수 없다. 

  (this - 자신의 영역 안에 있는 메모리에 접근)  

3. 객체 한번에 모두 불러오기 

4. 객체와 관련된 키워드

① in 키워드:해당 키가 객체 안에 있는지 확인(존재 유무) 

있으면 true , 없으면 false 출력.

② with 키워드:복잡하게 사용해야 하는 코드를 짧게 줄여주는 키워드

- with 키워드를 사용하지 않은 경우

-  with 키워드를 사용한 경우

with로 객체를 불러와서 . student를 붙이지 않아도 같은 값을 출력 

5. 객체의 속성 추가와 제거 

동적 속성 추가/제거 : 처음 객체 생성하는 시점 이후에 객체의 속성을 추가하거나 제거 

- this 를 이용해서 key - value값을 가지고 와서 결과를 반환. 

- key != 'toString' :  toString은 출력되지 않도록 합니다. 

- 객체의 속성 제거

alert(student); 메서드 호출을 한것이 아닌데 결과 값을 잘 출력합니다. 그 이유는 주소값을 가지고 있는 참조변수를 넣으면 출력하도록 기능이 들어가있습니다. 

6. 생성자 함수 

- new 키워드를 사용해 객체를 생성할 수 있는 함수

- 생성자 함수를 사용한 객체의 생성과 출력

- 그냥 함수를 사용해 객체를 리턴하는 방법과 차이가 없어 보임

- 함수와 비교를 위해 첫글자를 대문자로 저장(약속)

- java의 참조자료형의 형태 이지만 javascript는 함수로 사용

- 반드시 this. 키워드를 붙여서 넣어줘야 함.

  function Student(name, korean, math, english, science){
	    // 속성
	    this.이름 = name;
	    this.국어 = korean;
	    this.수학 = math;
	    this.영어 = english;
	    this.과학 = science;
	    
	    // 메서드
	    this.getSum = function (){ // 정수의 총합
	    	return this.국어+this.수학+this.영어+this.과학;
	    };
	    
	    this.getAverage = function() { // 정수의 총합
	    	return this.getSum()/4; // 같은 영역 안에서 함수의 이름으로 출력 가능 
	    }
	    this.toString = function() { 
	    	return this.이름+':   '+this.getSum()+',   '+this.getAverage();
	    } // 데이터 출력(alert을 호출할 때, 함수가 들어가 있는 변수는 함수 없이 출력된다.)
    };

 	var students = []; //  [ ] : 배열 
    students.push(new Student('홍길동', 87, 98, 88, 95));
    students.push(new Student('홍길서', 92, 98, 96, 90));
    students.push(new Student('홍길남', 76, 78, 94, 90));
    students.push(new Student('홍길북', 68, 78, 84, 92));
    students.push(new Student('김길동', 84, 98, 88, 95));
    students.push(new Student('이길동', 87, 98, 88, 95));
    students.push(new Student('박길동', 87, 98, 88, 95));
    students.push(new Student('오길동', 87, 98, 88, 95));

    var output = '이름    총점    평균\n';
    for(var i in students){
    	output += students[i].toString()+'\n';
    }
    
    alert(output); 

- 생성자 안에 메서드도 함께 선언. 

- ouput 에 누적되어 저장하되, alert를 통해서 출력. 

7. 프로토타입 

- 생성자 함수를 사용해 생성된 객체가 공통으로 가지는 공간.
- 자바스크립트의 모든 함수는 변수 prototype을 갖고 prototype은 객체다.

- java의 static과 같은 기능 

  function Student(name, korean, math, english, science){
	    // 속성
	    this.이름 = name;
	    this.국어 = korean;
	    this.수학 = math;
	    this.영어 = english;
	    this.과학 = science;
    }
    
    Student.prototype.getSum = function(){ // 총합
    	return this.국어+this.수학+this.영어+this.과학;
    };
    
    Student.prototype.getAverage = function(){ // 평균
    	return this.getSum()/4;
    };
    
    Student.prototype.toString = function(){ // 출력 
    	return this.이름+':   '+this.getSum()+',   '+this.getAverage();
    };
    
    var students = []; // 배열 
    students.push(new Student('홍길동', 87, 98, 88, 95));
    students.push(new Student('홍길서', 92, 98, 96, 90));
    students.push(new Student('홍길남', 76, 78, 94, 90));
    students.push(new Student('홍길북', 68, 78, 84, 92));
    students.push(new Student('김길동', 84, 98, 88, 95));
    students.push(new Student('이길동', 87, 98, 88, 95));
    students.push(new Student('박길동', 87, 98, 88, 95));
    students.push(new Student('오길동', 87, 98, 88, 95));
    
    var output = '이름    총점    평균\n';
    for(var i in students){
    	output += students[i].toString()+'\n';
    }
    alert(output);

- 생성자에 필드만 선언하고 메서드는 프로토 타입으로 공통적으로 사용되므로 언제든지 필요한 곳에서 사용

- 코드상에서는 큰 변화는 없지만 구동상에 메모리를 효육적으로 사용 

8. instanceof 키워드  

- 인스턴스:생성자 함수를 통해 만들어진 객체.
- 해당 객체가 어떠한 생성자 함수를 통해 생성됐는지를 확인할 때 사용하는 키워드.

- 피연산자 2개 필요 = (참조변수  instanceof  자료형)

- 상속의 다형성에 의해서 지원

alert(student instanceof Student); 

alert(student instanceof Student); 

9. 상속

- 문법적으로 약속된 규칙은 없음. 

- 생성자 함수를 정의 하면서 필드에 담아주는 것이 가능한 것이 상속을 통해서 가능

  function Rectangle(w,h){ // 생성자 함수 (반드시 this.붙어야한다)
	    var width = w; // 함수안에서 사용하기 위한 지역 변수 선언(this(x), - field(x))
	    var height = h;  // 함수안에서 사용하기 위한 지역 변수 선언(this(x), - field(x))
	    
	    this.getWidth = function() {return width;} // 메서드 사용(this(0))
	    this.getHeight = function () {return height;} // 메서드 사용(this(0))
	    
	    this.setWidth = function(value){
	    	if(value < 0){
	    		throw '길이는 음수일 수 없습니다.';
	    	} else {
	    		width = value;
	    	}
	    }
	    
	    this.setHeight = function(value){
	    	if(value < 0){
	    		throw '길이는 음수일 수 없습니다.';
	    	} else {
	    		height = value;
	    	}
	    }
    }
	
    Rectangle.prototype.getArea = function () {
    	return this.getWidth() * this.getHeight();
    }
 
    
    function Square(length){
    	this.base = Rectangle;
    	this.base(length, length)
    }
    Square.prototype = Rectangle.prototype;
    
    var rectangle = new Rectangle(5, 7);
    var square = new Square(5);
    
    alert(rectangle.getArea());
    alert(square.getArea()); 

alert(rectangle.getArea());

  alert(square.getArea()); 

1. 함수를 매개 변수로 받는 함수 

① 익명함수를 매개변수로 전달

callFunctionTimes 함수의 형태로 'Hello JavaScript...' 가 출력됩니다.(x5)

②  선언적 함수를 매개변수로 전달

callFunctionTimes 함수의 형태로 justFunction이 출력됩니다.(x5)

2. 자바스크립트 내장 함수

① eval(string) : string을 자바스크립트로 실행.

alert(willEval) 실행.

문자열 데이터를 그대로 실행. 

eval(willEval) 실행.

문자열로 보는 것이 아니라 javascript code로 인지하고 10 이라는 값만 출력 

② isFinite(number)
- number가 무한한 값인지 확인 
- 자바스크립트는 0으로  숫자를 나누면 Infinity(변수)라는 값이 들어감

③ isNaN(number)
- number가 NaN(Not a Number:변수)인지 확인
- 자바스크립트가 표현할 수 없는 숫자를 의미

0으로 나눴기 때문에  Infinity 출력 하여 = false ,  문자로 나눴기 때문에 숫자가 아니므로 NaN이 출력하여 = true 
    

NaN 값의 비교 - NaN은 스스로를 비교할 수 없다(비교, 산술 연산에 사용x - 무조건 false 출력) 

isNaN( ) 안에 변수를 넣어서 참, 거짓을 파악. 

④ Number() 함수 : 숫자형만 출력 

⑤  parseInt() 함수 & parseFloat() 함수 : 숫자형과 문자가 함께 있을 때, 숫자만 출력 / 단, 숫자가 먼저나와야 함. 

문자가 먼저 나와서 NaN 출력 

숫자 출력 

함수 

※ method 와 함수의 차이

- 함수 : 범용적으로 누구든지 필요로하면 호출하여 사용할 수 있도록 정의되어 있는 것.

- method : 참조자형으로, 객체(object)에 특화 되어있는 특징이나 기능을 정의하고 있는 것

1. 함수의 개요 

- 익명함수 : 이름을 가지고 있지 않은 함수.
- 선언적 함수 : 이름을 가지고 있는 함수.
 

● 익명함수의 정의 (구조 - R과 동일)  = 이름을 가지고 있지 않은 함수.

● 함수의 호출 방법 

변수의 이름으로 함수를 호출합니다. 

● 내가 정의한 코드는 소스코드가 보여줍니다. 

● 소스코드(x) - 내장함수는 보이지 않습니다.

● 선언적 함수의 정의 = 이름을 가지고 있는 함수

 2. 함수의 재정의  

: 함수를 한번 더 선언해야할 상황. 

① 익명함수의 재정의

(마지막에 선언한 변수 출력)

같은 이름의 변수를 선언하여도 error를 내지 않습니다. 실행상에 있어서는 크게 문제는 없지만 Javascript는 중복을 확인 하지 않기 때문에 주의해야합니다. 

변수 선언을 하기전에 출력을 먼저하게 되면 error 로 아무것도 출력하지 않습니다. 

② 선언적 함수의 재정의

웹브라우저는 script 태그 내부의 내용을 한 줄 한 줄 읽기전에 선언적함수를 읽습니다. 

(마지막의 선언된 함수가 출력 = 둘째줄 -> 셋째줄 -> 첫째줄 순서로 실행)

- 문제점 : 동일한 이름으로 선언되었을 때, 앞에 넣었던 기능은 수행하지 않을 수 있기 때문에 주의해야 합니다. 

 3. 매개변수

: 함수에 값을 줘서 실행을 시킵니다. 값을 전달하는 변수를 매개변수라고 합니다. 줄 때는 값으로 주지만 함수가 받을 때는 변수로 받습니다. 준만큼 받아야합니다. 갯수가 동일해야합니다. 매개 변수는 계산을 하기 위해 정의합니다. 매개 변수는 사용된 해당 함수 안에서만 사용됩니다.

● 두번째 매개변수는 무시( alert 매개변수를 1개만 받습니다. )

● 두번째 매개변수는 undefined

● 매개변수 불일치 사용 예
Array() 함수는 기본적으로 매개변수에 아무것도 입력하지 않게 설계

- 내부적으로 처리하게 되어있기도 합니다. (전부 그런것 x) 

4. 가변 인자 함수 

- 매개변수의 개수가 변할 수 있는 함수.
- 자바스크립트는 매개 변수의 개수를 정의된 것과 다르게 사용해도 괜찮지만, 매개 변수 선언된 형태와 다르게

  사용했을 때도 매개변수를 모두 활용하는 함수를 뜻합니다. 

① arguments 변수 사용 예제

② 입력 매개 변수를 모두 더해 리턴하는 함수

return :

1) 함수를 벗어나서 호출한 쪽으로 복귀

2) 값을 같이 가지고 복귀하고 싶을 때, 값을 전달 받아서 호출한 쪽으로 복귀하면서 전달 

5. 내부 함수 

- 제곱을 구하는 함수

선언적 함수의 재정의에 의해서 앞의 잘수행되던 함수가 문제가 생겨서 0의 값이 나오고 뒤의 정의 된 함수는 정상적으로 수행되었습니다. 

문제 해결) 내부의 함수를 정의하면, 밖에 같은 이름의 변수가 정의 된다고 하더라도 문제 없이 출력됩니다. 

while 문

: 어떤 조건문이 참이기만 하면 문장을 계속해서 수행합니다. while 문은 다음과 같습니다.

예제 1)

	var value = 1;
	
	while(value < 5){
		alert(value+'번째 반복');
		value++;
	}

do ~ while 문

var value = 1;

	do{
		alert(value+'번째 반복.');
		value++;
	}while(value <= 5);

for 반복문 

	var array = ['포도', '사과', '바나나', '망고'];
	
	for(var i=0; i < array.length; i++){
		alert(array[i]);
	}

for in 반복문 

var array = ['포도', '사과', '바나나', '망고'];
	for(var e in array){
		alert(array[e]);
	}

break 키워드 

for(var i=0; true; i++){
		alert(i+'번째 반복');
		
		if(!confirm('계속하시겠습니까?')){
			break;
		}
	}

확인 누름. 

확인 누름

취소를 누르면 나가집니다. 

if 조건문 

: 조건문은 if로 시작합니다. if 뒤의 괄호에 조건이 오고, 조건이 될 수 있는 값는 Boolean입니다. 

  Boolean의 값이 true라면 조건이 담겨진 괄호 다음의 중괄호 구문이 실행됩니다. java와 동일하게 사용합니다 .

else

: if문의 조건이 true라면 if의 중괄호 구간이 실행되고, false라면 else 이후의 중괄호 구간이 실행됩니다. 즉 else는 주어진 조건이 거짓일 때 실행할 구간을 정의하는 것입니다. 

else if

: else if는 좀 더 다양한 케이스의 조건을 검사할 수 있는 기회를 제공합니다. else if의 특징은 if나 else와는 다르게 여러개가 올 수 있습니다. else if의 모든 조건이 false라면 else가 실행됩니다. else는 생략 가능합니다. 

 switch 조건문

: 해당 조건에 맞는 값을 case로 구분해서 수행하는 제어문입니다.

1) 괄호 안에 있는 식의 결과가 case문의 값과 일치하는 실행문으로 이동합니다. 

2) 실행 문장들을 실행 하다가 breadk 문을 만나면 switch문을 벗어납니다. 

3) 일치하는 case 문이 없으명 default 값으로 이동합니다. 

4) swicth 문에서는 실행 문자를 { } 중괄호로 둘러싸지 않습니다.  

break의 역할 

- case문 내에서 실행문장을 실행하다가 break 문을 만나지 못하면 break문을 만날 때까지 그 아래 다른 case문의 실행문들 실행합니다. 

짧은 조건문(cf. SCE) 

- true 에 or 를 만나면 당연히 true 값이 나오니깐 출력 x

- false 에 or 를 만나면 뒤에 값이 무엇인지에 따라서 결과 값이 달라 지기 때문에 출력 o 

밑의 형식으로 더 많이 사용됩니다. 

undefined 자료형 

1. 존재하지 않는 것을 표현하는 자료형 

- 한번도 사용하지 않는 자료형 

2. 변수를 선언했지만 초기화 하지 않았을 때.

- 값을 저장하지 않은 자료형 ( 데이터를 담기 전까지 자료형이 정해지지 않습니다.) 

* 동적 언어 : 값을 넣을 때까지 자료형이 결정되지 않는 언어( R, Python, JavaScript...) 

* 정적 언어 : 자료형이 미리 결정되어 있는 언어(Java, DataBase...)

연산자 

산술 연산자 :  +, -, *, /,% 
	  
비교 연산자 :  <, >, <=, >=, ==, !=  (결과값 : boolean)
	  
논리 연산자 :  &&, ||, !  (결과값 : boolean)

복합 대입 연산자 : += , -=, *=, /=, %= (누적)

증감 연산자 : ++, --

- Java와 차이점 

JAVA - 정수/정수 = 정수

JavaScript - 정수/정수 = 실수(소수점 까지 출력) 

- 증감 연산자

- ruturn 되어지는 값이 ++number은 증가 한 값을, number++ 원래 값을 출력합니다. 

- 일치 연산자 

숫자 == 문자열 : ERROR가 나와야 할 것 같은데? 결과는 True  숫자형으로 변환해준 것 입니다. 

=== : 양변의 자료형과 갑이 일치
!== : 양변의 자료형과 값이 다름

배열 

동일 자료형이여야 하는 전제 조건이 붙지 않습니다. 

※ int[] array = {1,2,3,4,5}; =  java 배열의 형태 javascript는 { } 를 객체를 생성시에 사용합니다. 

삼항 연산자

( 조건 ? True 값: False 값; )