☭DEVELOPER/#2 웹개발(자바기반 풀스택)

[JAVASCRIPT]함수

조반짝 2023. 7. 24. 11:17
728x90
반응형

1.함수 불러오기

함수 만들기

함수를  만들고 함수 변수이름을 밑에다가 써야 화면에 출력된다.

함수를 필요할 때마다 불러오는 것이다.

  <script>
        let i = 0;
        function myfuc(){
            i++; //1씩증가
            document.write("hello+i","<br>")
        }
        myfuc();
        myfuc();
        myfuc();
        myfuc();
    </script>

2. 인명함수: 변수 안에 함수를 정의

 let i= 0;
        let theFun = function(){}

인명함수는 반드시 위에서 변수를 지정해야 결과값이 나온다. 

순서가 중요함

let i= 0;
        let theFun = function(){
            i++;
            document.write("bye"+i,"<br>");
        }
        theFun();
        theFun();
        theFun();

3.배경색 바꾸기

 

console에서 보면 숫자대로 컬러이름이 나온다.

변수 i값을 초기화

let i =0;

만약에 i가 4와 같으면 

4를 갯수로 변경 >> color.length

 if( i >= 4) i=0;
if(i >= color.length) i=0;

전에 i가 1값이어서 콘솔로그 밑에 i++ 밑으로 배치해야 white 부터 시작한다.

body 에 컬러 넣기

태그이름을 스크립트에 불러오기

let bodyTag = document.getElementsByTagName("body")[0];

<button onclick="colorBg();">배경바꾸기</button>
    <script>
        let color = ["white","yellow","aqua","purple"];
        // console.log(color[1])
        let i =0; //변수 i값을 초기화 //변수 i값을 초기화
        function colorBg(){
            i++;
            if(i >= color.length) i=0;
            // console.log(color[i]);
            let bodyTag = document.getElementsByTagName("body")[0];
            bodyTag.style.backgroundColor=color[i];
        }
     
        
    </script>

4. return

● return : calc()이 함수에 result 변수를 넣어주겠다.

1)

 

2)

변수로 들어가있는  myFunc 이 들어올때마다 달라지기 때문에 

들어오는 값을 변수처리하여 대입하면 된다. 

function myFunc(a,b){
            let num = a * b;
            return num;
            //num을 return하겠다.
        }

        let result = myFunc(10,3);
        document.write(result);

 

3) 리턴은 값을 있으면 값을 가지고 처리하지만 값이 없으면 처리하지않는다

리턴 아래 있으면 값이 처리되지 않는다.

리턴은 값을 가지고 처음으로 돌아가는 명령어.

5. 재귀함수

num++; 0을 증가시키기

만약에 num이 10과 같을 때 return해라

결과값은 1일 나온다.

밖에서 textFun 호출하면 1밖에 안나오지만

textFun을 안에도 호출하면 반복해서 출력된다.

내몸속에서 함수를 한 번더 실행한다. 이것을 재귀함수라 한다.

for문 반복문과 비슷하게 사용할 수 있음

 //재귀함수
        let num = 0;
        function textFun(){
            num++;
            document.write(num,"<br>");
            if(num == 10) return;
            textFun();
        }
        textFun();

6. 지역변수 

해당 오브젝트에서만 사용하기 위한 변수

7. 전역변수 

모든 오브젝트에서 사용하기 위한 변수

 

 

728x90
반응형