Javascript

function func(){
        document.write("함수가 실행되었습니다.1")
    }
    func();
    

const func = function(){
        document.write("함수가 실행되었습니다.2");
    }
    func();
    

function func(str){             //str: parameter, 변수, 인자, 매개변수(-> 4. 변수 : 지역변수 + 전역변수 + 매개변수)
        document.write(str);
    }
    func("함수가 실행되었습니다.3");
    

function func(){
        const str = "함수가 실행되었습니다.4";
        return str;
    }
    document.write(func()); // 리턴값이 있기 때문에 실행문 안에 함수의 실행문이 들어가 있어도 값이 나온다
    

// 선언적 함수
    // function func(){
    //     document.write("함수가 실행되었습니다.5")
    // }
    // func();
    
    // 화살표 함수(선언적 함수)
    // func = () => {       //=> function
    //     document.write("함수가 실행되었습니다.5")
    // }
    // func();
    
    // 화살표 함수(중괄호 삭제)
    func = () => document.write("함수가 실행되었습니다.5");
    
    func();
    

// 익명 함수
    // const func = function(){
    //     document.write("함수가 실행되었습니다.6");
    // }
    // func();
    
    // 화살표 함수(익명 함수)
    // const func = () => {
    //     document.write("함수가 실행되었습니다.6");
    // }
    // func();
    
    // 화살표 함수(중괄호 삭제)
    const func = () => document.write("함수가 실행되었습니다.6");
    
    func();
    

// 변수 선언을 해줘야 하지만 매개변수 함수에서는 생략 가능
    // function func(str){
    //     document.write(str);
    // }
    // func("함수가 실행되었습니다.7");
    
    // 화살표 함수(매개변수 함수)
    // func = (str) => {
    //     document.write(str);
    // }
    // func("함수가 실행되었습니다.7");
    
    // 화살표 함수(중괄호 삭제)
    // func = (str) => document.write(str);
    // func("함수가 실행되었습니다.7");
    
    //(앞에 const 있어도 상관 없음)func = str => document.write(str);
    
    func = str => document.write(str);
    
    func("함수가 실행되었습니다.7");
    

//리턴값 함수
    // function func(){
    //     const str = "함수가 실행되었습니다.8"
    //     return str; //리턴이랑 실행함수 다름
    // }
    // document.write(func());
    
    
    //화살표 함수(리턴값 함수)
    func = () => {
        const str = "함수가 실행되었습니다.8"
        return str;
    }
    document.write(func());
    

const func = (str) => {
        return str;
    }
    document.write(func("함수가 실행되었습니다.9"));
    

const func = str => {
        return str; //return 결과를 의미
    }
    document.write(func("함수가 실행되었습니다.10"));
    

const func = str => str;
    
    document.write(func("함수가 실행되었습니다.11"));
    

func = str => str;
    
    document.write(func("함수가 실행되었습니다.12"));
    

function func(num, str1, str2){
        document.write(num + ". " + str1 + "가 " + str2 + "되었습니다.");
    }
    func("1", "함수", "실행");
    // 위의 함수 재활용해서 또 쓰지 않고도 추가 시켜줄 수 있음
    func("2", "자바스크립트", "실행");
    func("3", "제이쿼리", "실행");
    

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 = "실행";
    
    // 1. 함수가 실행되었습니다.
    func(youNum1, youStr1, youCom1);
    
    // 2. 자바스크립트가 실행되었습니다.
    func(youNum2, youStr2, youCom1);
    
    // 3. 제이쿼리가 실행되었습니다.
    func(youNum3, youStr3, youCom1);
    

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);
    

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

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

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

// 반복적으로
function func(num){
    if ( num <= 1 ){
        document.write("함수가 실행되었습니다." + num);
    } else {
        document.write("함수가 실행되었습니다." + num);
        func(num - 1);
    }
}
func(10);

// 애니메이션
function animation(){
    document.write("함수가 실행되었습니다.");

    requestAnimationFrame(animation);
}
animation();

// 재귀함수 : 동시에 여러개 실행
// 콜백함수 : 첫번쨰 함수가 실행 -> 두번째 함수가 실행
function func(){
    document.write("함수가 실행되었습니다.2");
}

function callback(str){
    document.write("함수가 실행되었습니다.1");
    str();
}

callback(func);

// 재귀함수 : 동시에 여러개 실행
// 콜백함수 : 첫번쨰 함수가 실행 -> 두번째 함수가 실행
function func(){
    document.write("함수가 실행되었습니다.2");
}

function callback(str){
    document.write("함수가 실행되었습니다.1");
    str();
}

callback(func);

class study {
    // 생성자함수 constructor
    constructor(num, name, job){
        this.num = num;
        this.name = name;
        this.job = job;
    }
    
    result(){
        document.write(this.num + ".내 이름은 " + this.name + "이며, 직업은 " + this.job + "입니다.");
    }
}
const info1 = new study ("1", "웹쓰", "웹퍼블리셔");
const info2 = new study ("2", "웹스토리보이", "프론트앤드 개발자");

info1.result();
info2.result();

class study {
    // 생성자함수 constructor
    constructor(num, name, job){
        this.num = num;
        this.name = name;
        this.job = job;
    }
    
    result(){
        document.write(this.num + ".내 이름은 " + this.name + "이며, 직업은 " + this.job + "입니다.");
    }
}

// 클래스 상속
class study2 extends study {
    constructor(num, name, job, age) {
        super(num, name, job);
        this.age = age;
    }

    result2(){
        document.write(this.num + ".내 이름은 " + this.name + "이며, 직업은 " + this.job + "이며 나이는 " + this.age + "살 입니다.");
    }
}

const info1 = new study ("1", "웹쓰", "웹퍼블리셔");
const info2 = new study2 ("2", "웹스토리보이", "프론트앤드 개발자", 100);

info1.result();
info2.result2();