혁신을 이룹니다, 오딘박스(OdinBOX)

언제나 어디서나 오딘박스와 함께!

클라이언트사이드프로그래밍 - 09.30

간지뽕빨리턴님 2019. 11. 24. 20:37
반응형
  클라이언트사이드

화살표 함수  (익명 함수를 조금 더  간단하게 만든 것 )

let 변수명 = ()==>{}

let doubleX = (n) == > {return 2*n}

 

[??].toString < 안에 머가 있는지 알 수 있음.

 

 

매개변수초기화

function doubleX(n) {return 2 * n;}

doubleX(5) 10 정상적인 호출의 결과

doubleX() 호출은 가능함 NaN( Not a Number)

 

매개 변수 생략한 호출에 대비하는 방법

함수 본문에서 점검하고 처리할수있따.

function doubleX(n) {

//매개 변수 초기화

if(!n) {

n=0;

}

return 2*n;

}

 

 

디폴트(default)매개 변수 가능

ECMAScript6

function doubleX(n=0){

return2*n;

}

콜백(Callback) 함수

JavaScript에서 함수는 일급 객체

일급 객체

변수에 담을 수 있다.

사례 1. 익명 함수 2. 화살표 함수

 

반환 값으로 사용 할 수 있다.

런타임에 생성 할 수 있다.

    function helloMaker(host) {
      let sayHello = function(guest) {
        return `Hi Hello ! ${guest}씨, 저는 ${host}입니당.`
      }
      return sayHello;
    }

 

표준 내장 함수

숫자변환함수

-문자열을 수로 변환할 떄 사용

parseInt('문자열'

pareseFloat('문자열')

타이머함수

시스템 시계를 활용하는 유용한 함수

setTimeout(함수,시간)

특정 시간(ms) 후에 함수 실행

 

setInterval(함수,시간)

특정 시간(ms)마다 함수 반복 실행

clearInterval(id)

setInterval(..)이 반환한 id로 반복 실행타이머를해제할수있음

 

 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
    let doubleX = (n) => {
      //      if(n === undefined) // 비교를 할 수있는 데이터타입도 비교를 할수 있게 하는것 ///
            if(!n)
//매개 변수 값이 지정되지 않고 호출되었으면..
    n = 0;
    return 2*n;
 
    }
    let max = (a,b) => {return (a>b) => {return(a>b)?a:b;};
    let maxOfthree = (a,b,c) = {
      if {a>b}
      else {
       return max(b,c);
    }
    console,log(doubleX());
    console,log(doubleX(3434));
 
 
 
 
    function helloMaker(host) {
      let sayHello = function(guest) {
        return `Hi Hello ! ${guest}씨, 저는 ${host}입니당.`
      }
      return sayHello;
    }
 
    let hello1 = helloMaker("앙앙아앙앙앙");
    let hello2 = helloMaker("아으아아앙");
 
    console.log(hello1("젖꼭지종찬띠");
 
    console.log(hello2("앙종찬띠");
 
 
    function boom() {
      console.log("종찬이 꼭지 BBooooooooooooooMMMMMM! 아파욧>.<");
    }
 
    setTimeout(boom, 3000);
        setTimeout(boom, 4000);
            setTimeout(boom, 5000);
 
 
 
 
 
 
<!DOCTYPE html>
<html lang="ko" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>클라이언트 사이드 프로그래밍 - 2반</title>
  </head>
  <body>
    <h1> 클라이언트 사이드 프로그래밍 - 2반</h1>
    <h3> 함수 연습 </h3>
 
  </body>
  <script type="text/javascript">
    var handle; // setInterval(showTime, 1000); 등록 키 저장용
 
    function showTime() {
      let now = new Date(); //현재 시스템 시간을 읽어 now에 저장
      console.log(now);
    }
    function stopTime() {
      clearInterval(handle);
    }
 
    handle = setInterval(showTime, 1);
    setTimeout(stopTime, 1000);
 
 
  </script>
 
</html>
 
cs