ํ๋ก๊ทธ๋๋ฐ ํจ๋ฌ๋ค์์ ๋ํด ์๊ฒ๋์๊ณ , ๊ทธ์ค ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ ์๋ฏธ
,์กฐ๊ฑด
,๊ทธ ์์
์ ๋ํด ๊ณต๋ถํด๋ณด์๋ค.
*ํ๋ก๊ทธ๋๋ฐ ํจ๋ฌ๋ค์
: ํ๋ก๊ทธ๋๋ฐ์ ์ด๋ป๊ฒ ์ดํดํ๊ณ ๊ตฌ์ํ ์ง ์๊ฐํ๋ ๊ด์
๐ํจ์ํ ํ๋ก๊ทธ๋๋ฐ
โซ๏ธ ํจ์ ๋ฆฌํฐ๋ด
ํจ๊ตฌ๋ ๊ฐ์ฒด
์ฒ๋ผ ๋ณ์
๋ ํจ์์ ์ธ์์ฒ๋ผ ๋ค๋ฃฐ ์ ์์
sdie effect ๊ฐ ์ ์
โซ๏ธ ํจ์ํ ํ๋ก๊ทธ๋๋ฐ
- ์ธ๋ถ์ ์ํฅ์ ๋ฐ์ง ์๋ ํจ์๋ก ๊ตฌํํ๋ ํ๋ก๊ทธ๋จ ๊ธฐ๋ฒ
- ๋ชจ๋ ๊ฑธ ํจ์๋ก ์คํ
ํจ์
:input
&output
์ผ๋ก ์ด๋ฃจ์ด์ง ->๋ช ๋ นํ - ์์ํจ์๋ง ์ฌ์ฉ
์์ํจ์
: ์ฃผ์ด์ง input๋ง์ ์ฌ์ฉํด output ์์ฑ -> ํจ์ ์ธ๋ถ(ex ์ ์ญ๋ณ์)์ ๊ฒ ์ฌ์ฉ X ๋ถ์์ฉ(side effect)
: ํจ์ฃผ๊ฐ ์ฃผ์ด์ง input์์ ๊ณ์ฐํ์ง ์์ output์ ๋ด๋ณด๋ด๋ ๊ฒ
์๋ฒ๋ก๋ถํฐ ๋ฐ์ Data๋ฅผ ์กฐ์ํ๊ธฐ์ ์์ฃผ ์ข์ ๋ฐฉ์
์ผ๊ธํจ์
ํจ์๋ฅผ ๊ฐ์ฒด๋ก ์ทจ๊ธ
์์ํจ์
โซ๏ธ ์์ํจ์
๋์ผํ Input์ ๋์ผํ output์ ๋ฐํํ๋ฉฐ ์ธ๋ถ์ ์ํฅ์ ๋ฐ์ง ์๋ ํจ์
ex)
< ์์ํจ์ >
var name = "Tami";
functin greet(){
console.log("hi I'm "+name);
}
- ์ ์ญ๋ณ์ name ์ ์ฌ์ฉ
- console.log= ํจ์์ ๋ฐํ ๊ฐ X
< ์์ ํจ์ >
functin greet(name){
console.log("hi I'm "+name);
}
โซ๏ธ ๊ณ ์ฐจํจ์
input & output : ๋ค๋ฅธ ํจ์
ํจ์๋ฅผ ์ผ์ข
์ ๊ฐ์ฒด๋ก ๋ด
ex)
function makegreet(string){
return function greet(name){
return name + " " + string;
}
}
var hellogreet = makegreet("hello");
hellogreet("Tami"); // Tami hello;
๋ฐ๋ณต์ ํผํ์ (for, while...)
Map
, Reduce
, Filter
๋ชจ๋ data๋ฅผ ๋ถ๋ณ์ผ๋ก ๋๊ธฐ
ex)
"h3" ๋ฃธ์ "h4"๋ก ๋ฐ๊พธ๊ณ ์ถ์ ๋ ์๋ก์ด ๋ณ์๋ก ์ง์ ํ์ฌ ๋ฐ๊พธ์
var rooms = [h1,h2,h3];
ver newRooms = rooms.map(function(rm){
if(rm==="h3"){
return "h4"}
else return rm;
});
})
->๊ทธ๋ฌ๋ ๊ณ์ ์ฌ๋ณธ
์ด ์๊ธธ ๊ฒ (newRoom2,3,4...)
โซ๏ธ ์์์ ๋ฐ์ดํฐ ๊ตฌ์กฐ
๊ธฐ์กด ๋ฐ์ดํฐ๋ฅผ ์ฌ์ฌ์ฉํ์ฌ ํจ์จ์ ex) Map, Hash...Mori
:ํด๋น ๋ฐ์ดํฐ๊ตฌ์กฐ๋ฅผ ๋ค์ดํฐ๋ธ๋ก ๊ฐ๋ ClojureScript๋ฅผ ์ฌ์ฉํด ์๋ฐ์คํฌ๋ฆฝํธ์์ ์ฌ์ฉํ ์ ์๋๋ก ํฌํ
Immutable.js
: ๋ถ๋ณ๋ฐ์ดํฐ ๊ตฌ์กฐ ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ
๐ ๋๋ค์ ํด๋ก์
โซ๏ธ ๋๋ค Lambda
โซ๏ธ ํด๋ก์ Clocure
๋ด๋ถํจ์
๊ฐ์ธ๋ถํจ์
์ ๋งฅ๋ฝ์ ์ ๊ทผํ ์ ์๋ ๊ฒ- ํจ์ ๋ณธ๋ฌธ ์ ์๋ฅผ ๊ณต์ ํ์ง๋ง ๋ค๋ฅธ ๋งฅ๋ฝ์์ ํ๊ฒฝ์ ์ ์ฅํ๋ ๊ฒ
- ๋๋ค ์ ํํ์ผ๋ก ๋ณ์์ ์ ํจ๋ฒ์๋ฅผ ์ง์ ํ๋ ๋ฐฉ์(?)
< ์์ >
function A(){
var title = 'hi js';
function B(){
alert(title);
}
B();
}//hi js
B์ title ์ A์์ ์ฐพ์
=๋ด๋ถํจ์(B)๊ฐ ์ธ๋ถํจ์(A)์ ๋ณ์์ ์ ๊ทผ
function A(){
var title = 'bye js';
return function(){
alerg(title);
}
}// bye js
์ธ๋ถํจ์(A) ๊ฐ ์ข ๋ฃ๋ ์ดํ์๋ ์ธ๋ถํจ์(A)์ ์ ๊ทผ ๊ฐ๋ฅ
์๋ฐ์คํฌ๋ฆฝํธ
ํจ์๋ฅผ ๋ฆฌํด -> ๋ฆฌํดํ ํจ์๊ฐ ํด๋ก์ ์์ฑ
function adder(x){
var y = 1;
return function (z){
y=100;
return x+y+z;
};
}
var add5 = adder(5);
console.log(addt(2)); // 107
add5
: ํด๋ก์ x
: ์์ ๋ณ์y
: ๋ฌถ์ธ ๋ณ์๋ซํ ๋๋ค์
: ์ฌ์ฉํ๋ ๋ณ์๋ค์ด ๋ชจ๋ ๋ฌถ์ธ ๋ณ์์ด๋ฆฐ ๋๋ค์
: ์ด๋ฆฐ ๋ณ์๊ฐ ์กด์ฌํ ๋ํด๋ก์
: ์ด๋ฆฐ๋๋ค์ -> ๋ซํ ๋๋ค์ (๋๋ค์ ๋ด์ ๋ชจ๋ ์์ ๋ณ์๋ฅผ scope
๋ด๋ก ๊ฐ์ ธ์ ๋ฌถ์)
-> ์๋ฐ์คํฌ๋ฆฝํธ๋ ํจ์
๋ฅผ ๋ฆฌํดํ๊ณ , ๋ฆฌํดํ๋ ํจ์
๊ฐ ํด๋ก์
๋ฅผ ํ์ฑํ๊ธฐ ๋๋ฌธ์ ๋ณ์์ ๊ณ์ํด์ ์ ๊ทผ์ด ๊ฐ๋ฅํ๋ค.
โซ๏ธ Private variable
- ์ธ๋ถ์์ ์ ๊ทผํ ์ ์๋ ๋ณ์
- ๋ง์ ์ฌ๋์ด ํจ๊ป ๋ง๋๋ code์์ ๋๊ตฌ๋ ์์ ํ ์ ์๋ code์์์ sw๊ฐ ์ด๊ธ๋์ง ์๊ฒํ๋ ๋ฐฉ์ง์ฑ ์ค ํ๋(?)
- ๋ณ๊ฒฝ๋์ง ์์์ผ ํ ๋งฅ๋ฝ์ ์ํฅ์ ์ฃผ์ง ์๊ฒ ํ๋ ๋ณ์ ์ ์ธ
function A(title){ return { get_title : function(){ return title; } set_title: function(_title){ title = _title } } }
first = A('hi');
second = A('bye');
alert(first.get_title());// hi
alert(second.get_title());// bye
first.set_title('real bye');
alert(first.get_title());// hi
alert(second.get_title());// real bye
title์ ์ ๊ทผํ๊ธฐ ์ํด์๋ set_title, get_title์ ์ฌ์ฉํด์ผํจ
title = private variable
title ๊ฐ์ ธ์ค๊ธฐ : get_title
title ์์ ํ๊ธฐ : set_title
## โซ๏ธ ์์
< ์ผ๋ฐํจ์ >
```js
let print = function(x){
conseole.log(x);
}
< ๋๋ค์ ํจ์ (ํ์ดํ) >
let arrowprint = (y) =>{
console.log(y);
}
< map >๋ฐฐ์ด.map((์์,์ธ๋ฑ์ค,๋ฐฐ์ด) => { return ์์});
array=[1,2,3];
console.log(array.map(x => x.length));
//[1,2,3]
< reduce >๋ฐฐ์ด.reduce((๋์ ๊ฐ, ํ์ฌ๊ฐ, ์ธ๋ฑ์ค, ์์) => {return ๊ฒฐ๊ณผ}, ์ด๊ธฐ๊ฐ );
array = [1,2,3];
let sum = array.reduce(acc, cur, i) => { console.log(acc,curr,i); return acc+cur ;} ,0);
// 0 1 0
// 1 2 1
// 3 3 2
// 6
< map --> reduce >
์ด๊ธฐ๊ฐ์ ๋ฐฐ์ด
๋ก ํ๊ณ push ํจ
- ๋ฐฐ์ด์ ๊ธ์์
array = [1,2,3]; let len = array.reduce(pre, cur) => {pre.push(cur.length) return pre},[]);
- ๋ฐฐ์ด ์ค ํ์
array = [1,2,3]; let odd = array.reduce(pre, cur) => {if(cur%2) pre.push(cur); return pre;}, []);
ํจ์๊ฒฝ, ๊ฐ์ฒดํ ์ค์ํ๋ค๊ณ ํ์ง๋ง ๊ฒฐ๊ตญ ๊ฐ์ฅ ์ค์ํ๊ฑด ์ด๊ฒ์ด ํ๋ก๊ทธ๋๋ฐ์ ๋ชฉ์ ์ด ๋๋ฉด ์๋จ. ๊ทธ๋ค์ ์ฅ์
์ ์ด์ฉํ๋ ๊ฒ์ด ์ค์ํจ.
ํ๋ก๊ทธ๋๋ฐ ํจ๋ฌ๋ค์
ํ๋ก๊ทธ๋๋ฐ์ ์ด๋ป๊ฒ ์ดํดํ๊ณ ๊ตฌ์ํ ์ง ์๊ฐํ๋ ๊ด์
์ข ๋ฅ
๋ช ๋ นํ ํ๋ก๊ทธ๋๋ฐ
- ์ ์ฐจ์งํฅ
- ๊ฐ์ฒด์งํฅ
์ ์ธํ ํ๋ก๊ทธ๋๋ฐ
- ํจ์ํ
- ๋ฐ์ํ
ํจ์ํ ํ๋ก๊ทธ๋๋ฐ๊ณผ ๊ฐ์ฒด์งํฅ ํ๋ก๊ทธ๋งค๋ง์ ์ฐจ์ด
๋ฐ์ดํฐ๋ฅผ ๋ค๋ฃจ๋ ๊ฐ๋ & ๊ฐ๊ฒฐํ ์ฝ๋ ์์ฑ
๊ฐ์ฒด ์งํฅํ ํ๋ก๊ทธ๋๋ฐ
:๊ฐ์ฒด์ ๋ฉ์๋๊ฐ ์์ด ๊ทธ๊ฑธ ๋ณ๊ฒฝํ๋ ํ์
- | ๊ฐ์ฒด์งํฅํ | ํจ์ํ |
---|---|---|
ํน์ง | class์ ๊ฐ์ฒด์ ๊ด๊ณ ์ค์ฌ์ผ๋ก ์ฝ๋ ์์ฑ |
๊ฐ์ ์ฐ์ฐ & ๊ฒฐ๊ณผ๋์ถ ์ค์ฌ์ผ๋ก ์ฝ๋ ์์ฑ |
์ฅ์ | - ์ ์ง๋ณด์๊ฐ ์ฌ์ - ์ฝ๋์ ์ฌ์ฌ์ฉ์ฑ ๋์ | - ์์ ํธ๋ฆฌ -์ฐ์ฐ์์ ์ด ๋น์ค์ |
๋จ์ | ์ค๊ณ ๋จ๊ณ ๋ณต์ก | ๋ด๋ถ,์ธ๋ถ ๋ฐ์ดํฐ ์ํ ์กฐ์ ๋ถ๊ฐ |
'๐ JavaScript' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
Node.JS express๋ก ์๋ฒ ๊ตฌ์ฑํ๊ธฐ (5) | 2021.02.23 |
---|---|
์๋ฐ์คํฌ๋ฆฝํธ์ ๊ฐ์ฒด (0) | 2021.02.22 |
์ด๋ฒคํธ ๋ฒ๋ธ๋ง, ์ด๋ฒคํธ ์บก์ณ๋ง - DOM์ ์ด๋ฒคํธ ํธ๋ค๋ง (0) | 2021.02.22 |
[JavaScript ] ์ด๋ฒคํธํธ๋ค๋ง (0) | 2021.02.16 |
[JavaScript] DOM์ด๋ ๋ฌด์์ธ๊ฐ? (0) | 2021.02.16 |
๋๊ธ