Animated Rainbow Nyan Cat
본문 바로가기
javascript

함수 유형

by 이유나1 2022. 8. 22.
728x90
반응형

함수 유형 01 : 함수와 매개변수를 이용한 형태

함수 : 실행문 , 재활용
{
    function func(num, str1, str2){
        document.write(num + ". " + str1 + "가" + str2 + "되었습니다.
");
    }
    func("1", "함수", "실행");
    func("2", "자바스크립트", "실행");
    func("3", "제이쿼리", "실행");
}

함수 유형 02 : 함수와 변수를 이용한 형태

{
    function func(num, str1, str2) {
        document.write(num + ". " + str1 + "가" + str2 + "되었습니다.
");
    }
    const youNum1 = 1;
    const youNum2 = 2;
    const youNum3 = 3;
    const youStr1 = "함수";
    const youStr2 = "자바스크립트";
    const youStr3 = "제이쿼리";
    const youCom1 = "실행";

    func(youNum1, youStr1, youCom1);
    func(youNum2, youStr2, youCom1);
    func(youNum3, youStr3, youCom1);

    // 1. 함수가실행되었습니다.
    // 2. 자바스크립트가실행되었습니다.
    // 3. 제이쿼리가실행되었습니다.
}

함수 유형 03 : 함수와 배열, 객체를 이용한 형태

 {
    function func(num, str1, str2) {
        document.write(num + ". " + str1 + "가" + str2 + "되었습니다.
");
    }
    const info = [
        {
            num: "1",
            name: "함수",
            com: "실행"
        },
        {
            num: "2",
            name: "자바스크립트",
            com: "실행"
        },
        {
            num: "3",
            name: "제이쿼리",
            com: "실행"
        }
    ];
    func(info[0].num, info[0].name, info[0].com);
    func(info[1].num, info[1].name, info[1].com);
    func(info[2].num, info[2].name, info[2].com);
}

함수 유형 04 : 객체 안에 변수와 함수를 이용한 형태 - 재사용 불가

 {
    const info = {
        num1: 1,
        name1: "함수",
        woed1: "실행",
        num2: 2,
        name2: "자바스크립트",
        woed2: "실행",
        num3: 3,
        name3: "제이쿼리",
        woed3: "실행",

        result1: function () {
            document.write(info.num1 + ". " + info.name1 + "가" + info.woed1 + "되었습니다.
");
        },
        result2: function () {
            document.write(info.num2 + ". " + info.name2 + "가" + info.woed2 + "되었습니다.
");
        },
        result3: function () {
            document.write(info.num3 + ". " + info.name3 + "가" + info.woed3 + "되었습니다.");
        }
    }

    info.result1();
    info.result2();
    info.result3();
}

함수 유형 05 : 객체 생성자 함수

{
    function func(num, name, word) {
        this.num = num;
        this.name = name;
        this.word = word;

        this.result = function () {
            document.write(this.num + ". " + this.name + "가" + this.word + "되었습니다.
");
        }
    }

    // 인스턴스 생성
    const info1 = new func("1", "함수", "실행");
    const info2 = new func("2", "자바스크립트", "실행");
    const info3 = new func("3", "제이쿼리", "실행");

    // 실행
    info1.result();
    info2.result();
    info3.result();
}

함수 유형 06 : 프로트타입 함수

prototype 실행하고 싶은것만 실행 가능
{
    function func(num, name, word) {
        this.num = num;
        this.name = name;
        this.word = word;
    }
    func.prototype.result = function () {
        document.write(this.num + ". " + this.name + "가" + this.word + "되었습니다.
");
    }
    // 인스턴스 생성
    const info1 = new func("1", "함수", "실행");
    const info2 = new func("2", "자바스크립트", "실행");
    const info3 = new func("3", "제이쿼리", "실행");
    // 실행
    info1.result();
    info2.result();
    info3.result();
}

함수 유형 07 : 객체 리터럴 함수

{
    function func(num, name, word) {
        this.num = num;
        this.name = name;
        this.word = word;
    }

    func.prototype = {
        result1: function () {
            document.write(this.num + ". " + this.name + "가" + this.word + "되었습니다.
");
        },
        result2: function () {
            document.write(this.num + ". " + this.name + "가" + this.word + "되었습니다.
");
        },
        result3: function () {
            document.write(this.num + ". " + this.name + "가" + this.word + "되었습니다.
");
        }
    }

    // 인스턴스 생성
    const info1 = new func("1", "함수", "실행");
    const info2 = new func("2", "자바스크립트", "실행");
    const info3 = new func("3", "제이쿼리", "실행");

    // 실행
    info1.result1();
    info2.result2();
    info3.result3();
}
728x90

'javascript' 카테고리의 다른 글

mouseenter / movesover 차이점  (2) 2022.09.05
charAt ()  (3) 2022.08.22
match ()  (3) 2022.08.22
search ()  (4) 2022.08.22
includes  (2) 2022.08.17

댓글


/
/
/

CSS
광고준비중입니다.