🌈 함수

함수는 선언되면 자바스크립트는 함수가 가진 코드를 일단 넘어가고 호출되면 그때 다시 돌아와 코드를 실행합니다!

🌃 특성

• ✅아규먼트가 순서대로 들어가는 함수의 특성

<script>
function 함수(a=10, b=20, c=30){
    return a+b+c
}

함수() //60
함수(100) //150
함수(100,200) //330   a가 100, b에 200
함수(100,200,300)  //600
함수(c=300) //330 이 아니고 350입니다.순서대로 들어갑니다. a에 300이들어가요.
함수(a=100, c=300) //430
함수(a=100, b=300, c=300) //순서가 뒤바뀌면 안됩니다.

</script>

• ✅object 처럼 사용되는 함수의 특성
  console.dir 을 이용해 함수의 length를 확인할 수 있다

<script>
  function 함수3 (a,b,c,d,e,f) {
      return a
  }
  console.dir(함수3) // length:6
  //length가 파라미터의 수
</script>

🌃 roro 기법

<script>
    function 로그인정보({
       // = 를 쓴 이유는 할당하는 거에요.
        회원등급 = 'Gold',
        글쓰기 = true,
        글읽기 = true,
        채널관리 = true,
        백업 = '1주일 이내 가능',
        소셜로그인여부 = true
    }) {
        console.log('...함수기능...')
        console.log(회원등급, 글쓰기, 글읽기, 채널관리, 백업, 소셜로그인여부)
    }

    로그인정보({}) ////로그인정보() 로 호출하면 안됩니다. 에러나요
    //출력값
    ...함수기능...
    Gold true true true 1주일 이내 가능 true

    ---------------------
    로그인정보({
        회원등급 : 'Silver',
        소셜로그인여부 : false, //순서가 바뀌었지만 괜찮아요
        백업: '3일 이내 가능' //중간에 생략된 값도있쥬
    }) //전달해주는 형태는 이렇게 obj로

    //출력값
    ...함수기능...
     Silver true true true 3일 이내 가능 false

 
</script>

심화

<script>
  function 함수({
      a=1,
      b=2,
      c=3
  } = {}){ // = {}이렇게 해야하는건 알아두셔야합니다
      console.log(a,b,c)
      return a+b+c
  }

  함수()// 6
  함수({})//6
  함수({b:10}) // 14
</script>

🌈 스코프

스코프: 변수에 접근할 수 있는 유효범위

• 블록 레벨 스코프
  let 과 const는 블록 레벨 스코프를 가지고있어요.
• 안쪽 스코프에서 선언한 변수는 바깥쪽에서 사용불가

<script>

  {
      let x = 10
      const y= 20
  }
console.log(x,y) // 안됩니다. {} 밖에 못나와용.

------------------------------
var x = 1;

function foo() {
  var x = 10;
  bar();
}

function bar() {
  console.log(x);
}

foo(); // 1
bar(); // 1
</script>

<script>
let a = 10
let b = 10

function 함수1() {
    let a = 20
    let b = 20
    function 함수2() {
        let a = 30
        console.log(a, b)
    }
    함수2()
}

함수1() //30,20
</script>

전역변수와 지역변수

<script>
let x = 100
function 함수() {
    let y = 20
    console.log(x)
}

함수() // 100
</script>

---

참고: https://cotak.tistory.com/143

---

🌈 함수의 호이스팅

변수나 함수 선언문이 해당 스코프의 최상단으로 끌어올려지는 현상을 말합니다. 즉, 코드에서 변수나 함수를 선언하기 전에 해당 변수나 함수를 사용할 수 있는 것처럼 보이는 현상을 의미

• 변수 함수 메모리 공간을 선언 전 미리할당하는 것
• 변수나 함수 선언을 스코프 최상단으로 끌어올리는 것처럼 동작하는 것
• (함수나 변수를 끌어올려 주는 것 처럼 보임)
• 인터프리터(해석)이 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미

<script>
함수(10)

function 함수(x) {
    return x + 100
}

//110 

</script>

• 밑에 세 코드는 에러가 납니다.

<script>
////둘다 error! 왜냐면 let과 const로 함수를 선언해줘서 쓸거면 미리 선언하고
//그 다음부터 사용할수있다.
//앞에다가 미리 선언해야한다.

함수(10)

let 함수 = x => x + 100

// error가 생깁니다.
함수(10)

const 함수 = function (x) {
    return x + 100
}
</script>

<script>
let a = 10
        if(true){
            let a=20
            if(true){
                console.log(a)
                let a = 30
            }
        } //에러남 //일시적 사각지대 
        //스코프체이닝통해 위로올라감. a가 위로올라가는데 
        //console.log(a)에선 30이아직들어가지않았음그래서에러남.
        //let a라고 선언하면 최상단으로 올라감. 대신30은가져가지않아요.
</script>

🌈 즉시 실행 함수

<script>
// 익명 즉시 실행 함수
(function () {
    let a = 1;
    let b = 2;
    return a + b;
}());
// 선언과 동시에 바로 실행하겠다 //형태를 기억해주세요



// 기명 즉시 실행 함수
(function foo() {
    let a = 3;
    let b = 5;
    return a * b;
}());

주의! foo()// 에러뜸. 즉시 실행 함수는 밖에서 호출할 수 없습니다.
</script>

🌈 call by value, reference, sharing

• call by value (다른 언어에서 값의 전달을 표현하기위해사용)
• call by reference (다른 언어에서 주소값의 전달을 표현하기 위해 사용)
• 🌟array 와 같은 convension 자료형을 넘길 때에는 함수 안에서 값의 수정이 됩니다!🌟
• JavaScript는 call by value만 존재합니다.
• 객체자료형의 경우가 call by reference인 것 처럼 보이지만, 사실 주소가 넘어가는 것이 아니라 주소가 복사가 되어 넘어가기 때문입니다.

<script>
  let test1 = [10,20,30]

  function 값변경1(arr){
      arr[0]=100
  }
  값변경1(test1)
  console.log(test1) //[100,20,30]  
  // text1 -> 메모리주소 a
  //arr -> a

  -------------------------------------------------

  let test2 = 100  //메모리는 b  //test2 -> b 

   //value -> b 
  function 값변경2(value){
      value = 1000 //value -> 1000가리킴
  }
  값변경2(test2)  //100
  //test2는 여전히 b를 가리킴
  
  
  --------------------------
  call by ref 가 없는 반례
// 반례
var a = {};  //메모리주소 0x1001   // a -> 0x1001

//b-> 0x1001
function test(b) {
    b = 1000;  //1000의 메모리주소는 0x1010 // b ->  0x1010 //a ->0x1001
}

test(a)
a //{} 빈객체 뜸  //다른언어의 경우 call by ref로 동작하여 a의 값이 1000으로 바뀜.

//주소값을 넘기는거다...

</script>

• call by value
  아규먼트에 값이 넘어올 때 복사한 값이 넘어온다!

• call by reference
  아규먼트에 값이 넘어올 때 주소값이 넘어온다! (주소값이 넘어왔으니 접근을 하면 원본이다!)

• javascript는 참조값을 넘길 때 참조한 주소값을 '복사'하여 넘깁니다. 그래서 call by reference가 아니라 call by value입니다. '복사한 값'인거죠. 주소값도 값이니까요.

---

APi application programming interface
application을 프로그래밍하는데 필요한 도구

---

//let은 선언하고 그 다음부터 사용할수있어요

//코드를밑에다넣고 왜 실행안되지...? 아 위에 써야하구나! 이정도?