Java Script(2)

* var a = (20 > 30) ? " 와...ㅋ " : " ㅋㅋㅋㅋㅋ " ;
  console.log(a);
  

* || 와 && 의 다른 활용
  var x = 20 ;
  var b = true || (x = 30);
  //  앞이 true면 뒤에는 실행하지 않고 무조건 true 
  //  앞이 false면 뒤에 x를 실행
  
  var b = true && (x = 30);
  // 앞이 true면 뒤에도 실행함.
  // 앞이 false면 뒤에 실행하지 않고 무조건 false 
  
* 함수 선언
- 리턴 타입이 없다 . => 데이터형이 없기 때문에.
- 파라미터 변수는 var 을 붙이지 않는다.
- 모든 글러벌 변수, 함수는 window 객체에 포함된다.
 


* 자바스크립트 실행 순서
- 자바스크립트는 script 엘리먼트 단위 순서대로 실행된다.
- script 엘리먼트 안에서는 함수 선언을 먼저 실행하고 => 함수 밖의 문장을 순서대로 실행한다.
- 다음 script 엘리먼트에서는 이전 script 엘리먼트에서 만든 변수나 함수에 접근 할 수 있다.
- 단, 이전에 script에서 선언하지 않은 함수를 호출할수는 없다.
- 글로벌 변수, 함수이기 때문에 .


* 함수 선언 2
- 함수 객체를 생성하는 방법
-ex) var plus = function(a,b){
return a + b;
}
- function은 함수 객체의 주소값을 리턴한다.

- 파라미터 전달.
function plus2(a,b){
return a + b;
}

- arguments 감춰진 파라미터 배열 변수
- 함수에 넘어오는 모든 값들을 배열로 저장한다.
- arguments 변수로 인해 자바스크립트는 오버로딩이 없다.

-ex) function plus3(){
return arguments[0] + arguments[1]; // 유지보수가 어렵다.
}
 
function plus4(a){
return a + arguments[1];
}
 
- 변수의 범위
- 글로벌과 함수
- 블럭이 없다.
-ex) function f1(){
var a; // 글로벌 변수
a = 10;
b = 50; // 변수가 선언 되기 전에 값을 초기화 하나 마나다.
{
a = 40; // 덮어씌어진다.
var b = 30;
}

}




* nested 함수 리턴 
- 함수를 함수 안에 정의할 수 있다.
-ex) function getOperator(op){
if(op == 'plus'){
return function(a,b){ return a+b; }
}else if(op == 'minus'){
return function(a,b){ return a-b;}
}
}

var operator = getOperator('plus');
console.log(operator(10,20));

- 함수를 파라미터로 전달
-ex) function operator(v1,v2,func){
console.log("연산결과" ,func(v1,v2));
}
function opPlus(a,b){return a+b;}
function opMinus(a,b){return a-b;}
 
operator(100,200,opPlus);
 
* function closure
- nested 함수를 위한 메모리 공간
- nested 함수가 참고하는 로컬 변수는 'closure'라는 별도의 메모리 공간(복제)에 유지된다.
-ex) function outer(basic){
var a = basic; <-- closuer라는 복산된 별도의 메모리공간에 저장된다.

return function(v){ // nested 함수
console.log(v*a);
a = v;
};
}

var myFunc =outer(100);
var myFunc2 =outer(200);

myFunc(10);
myFunc2(20);


* 파라미터 함수의 활용

-ex)
var names = ['홍길동','유관순','임꺽정']
 
function each(arr, func){
for(var i in arr){
func(i,arr[i]);
}
}
 
each(names, function(index,item){
console.log(item);
});
 




* 함수를 정의하자마자 호출하는 방법
-ex) .function display(msg){
console.log(msg);
}
 
display("홍길동");
 
.var f1 = function(msg){
console.log(msg);
};
 
f1("오호라.....");
 
.(function(msg){
console.log(msg);
})("우히히히히힣히히히....");

* eval()함수 사용
- eval(자바스크립트 코드의 문자열);
-ex) var str = " var a = 20; console.log(a);";
eval(str);
 
==> 출력결과 : 20;
 
var str = " var a = '홍길동'; console.log(a);";
eval(str);
 
==> 출력결과 : 홍길동
 

Java Script (1)

* "use strict"; -- 브라우저에게 자바스크립트를 엄격하게 검사할 것을 요구

* 배경지식 
- 변수는 페이지 단위로 관리
- 글러벌 변수 = 그 페이지 내에서 어디서든 접근할 수 있는 변수.

* 변수와 자료형
- 변수 선언 : 데이터형을 선언하지 않는다. 
ex) var a;

a= 10; // Number데이터형
a= '홍길동'; // string 데이터형
a=true // boolean 데이터형
a=new Object() // Object 데이터형
a=function(){} // function 데이터형

(; <-- 을 굳이 붙이지 않아도 된다.)

- 출력 : 브라우저의 콘솔 창으로 출력할 수 있다.

* 바인딩 : 변수의 데이터형의 결정되는 것!
=> 값을 할당한 후 결정 된다.
ex) var b;
alert(b); ==> 결과 : undefined (바인딩이 안되어 있는 상태)

* 자료형 검사 : typeof();
-  변수의 데이터형 알아내기 : 바인딩 한 후 변수의 데이터형 확인 
ex) var b 
b = 10 
alert(typeof(b)); ==> 결과 : number

* 동적 바인딩(dynamic binding <> static binding ex) JAVA , C, C++, C#)
- 변수의 데이터형은 고정되어 있지 않다
- 값을 할당할 때 데이터형이 결정 되는 것.
- 가능한 변수의 용도를 결정했으면 그대로 사용.

* 이전의 자바스크립트 명세에서는 var을 선언하지 않고 만든 변수를 글로벌 변수로  설정  
  현재는 반드시 var을 붙여야 한다.
  
* 중복선언 가능 
- ex) var c = 10;
     alert(c);
     
     c= '홍길동'
     alert(c);
     
* window객체 : 브라우저에 미리 정의된 객체 , 브라우저의 정보를 다루는 객체
. 글로벌 변수나 함수를 포함하고 있다.
. 글로벌 변수는 모두 window 객체의 프로퍼티로 포함된다.
. 글로벌 함수도 또한 모두 window객체에 포함된다.

- ex) var a = 30;
 window.a = '홍길동'
 alert(a); ==> 결과 : 홍길동 // a 앞에 window 객체 레퍼런스가 생략된 것!
 alert(window.a); ==> 결과 : 홍길동
 
 
* prompt(), confirm()
- prompt()
ex) var v = prompt("이름이 뭐에요??") // 새로운 입력창이 뜬다. 결과를 쓰면 그게대한 새로운 창이 뜬다.
alert(v); 
 
- confirm()
ex) var v = confirm("당신은 비트 수강생입니까??")
   alert(v);
// confirm(".....")
// .... 안에 질문에 대해 확인을 누르면 true , 취소를 누르면 false 를 리턴한다.

* 배열 : [ , , , .....];
-ex) var names = ["홍길동", "임꺽정", "일지매"]
for( var i = 0; i < names.length; i++){
alert(names[i]);
}
 
==> 결과 : 홍길동 
 임꺽정
 일지매

* 자료형 null, undefined

* == 와 ==== 의 차이 
- var x1 = 20;
 car x2 = "20";
 
 // 암시적 형변환이 발생함.
 if(x1 == x2){  
  console.log("같다..");
 }
 
 // 암시적 형변환 없이 정확하게 데이터형과 값이 일치하는지 확인
 if(x1 === x2){ 
  console.log(" 같다..");
 }else{
  console.log(" 다르다..");
 }