SWEA_D4_7810_승현이의 질문
자바스크립트 > 웹 브라우저에서부터 서버까지 모든 웹의 범위에서 사용 가능한 `언어`
목차 - [설정](#poption) - [기본](#pbase) - [객체(Object)](#pobject) - [모듈(module)](#pmodule) - [응용](#pmore) - [콜백(callback)](#pcallback) - [Promise](#ppromise) - [클로저(Closere)](#pclosure) 설정 VS Code > View -> Extensions 클릭 `open in browser` 검색 후 install > > html 파일에서 `Alt + b`   Chrome > Chrome 브라우저 설치 후 `F12` 를 눌러 페이지를 확인 할 수 있다. 기본 - 숫자,문자 - 변수, 배열 - 비교, 조건문, 반복문 - 함수
> index로 직접 데이터를 지정할 수 있다. 자바스크립트의 객체는 `map` 혹은 `Json`과 비슷하다. (객체 지향 기법의 객체와는 조금 다르다.) ```javascript var grade = { 'A':10, 'B':5, 'C':1 } var name = new Object(); name['first'] = '황'; name['last'] = '하남'; console.log(grade['A']) console.log(name['last']) // 10, 하남 for(key in grade){ console.log(grade[key]) } // 10, 5, 1 ``` ```javascript var grade = { 'list' : {'A':10, 'B':5, 'C':1 }, 'show' : function(){ for(var key in this.list){ document.write(key + ':' + this.list[key] + "
"); } } } grades.show(); ```
"); } } } grades.show(); ```
> 작고 단순한 단위의 부품. 프로그램이 크다면 `module화` 하여 쪼갤 수 있다. >
응용node.js 나 vue.js 는 방법이 다를 수 있음!! ```javascript // hello.js function hello(){ return 'Hello JS'; } // main.html
``` html 에서 js를 가져와서 hello()를 쓸 수 있다. (body의 script는 alert을 쓰기 위함) [진짜 콜백은 여기](#realcallback) > `값으로서의 함수` === 함수를 value 처럼 사용한다.
함수 = 값
```js var a = function(){}; // a라는 이름으로 function을 만든 것 // 이름 규칙 function a(){} // 함수 a = { b : function(){ // 메소드 } } ``` 함수도 값이기 때문에 다른 함수의 인자로 활용 가능 ```js function cal(f, num){ return f(num); } function add(num){ return num + 1; } function sub(num){ return num - 1; } console.log(cal(add, 1)); // 2 console.log(cal(sub, 2)); // 1 ``` 함수를 함수의 return 값으로도 사용 가능 ```js function cal(mode){ var fs = { 'p' : function(l, r){ return l + r; }, 'm' : function(l, r){ return l - r; } } return fs[mode]; } console.log(cal('p')(5, 4)); // 9 console.log(cal('m')(5, 4)); // 1 // p 혹은 m 이라는 function이 return 된는 것이다. ``` 물론 배열의 값으로도 함수를 넣을 수 있다. ```js var arr = [ function(in){return in + 5;}, function(in){return in * 5;}, function(in){return in / 2;} ]; var input = 0; for(var i = 0; i < arr.length; i++){ input = arr[i](input); console.log(input); } // 5 // 25 // 12.5 ``` > 비동기 처리에 유용하게 사용된다. 내부 함수에서 처리의 위임 ```js function sortNums(a, b){ return b - a; } var nums = [4,3,6,5,2,1,0,10,20]; console.log(nums.sort(sortNums)); // array, [20,10,6,5,4,3,2,1,0] // a - b로 하면 반대로 됨. ``` 비동기 처리 ```js // data.json.js {"title":"JS","author":"hanam"} ``` ```html ```
hi
hi
