취미처럼

[Javascript] Define Function 본문

JavaScript/이론

[Javascript] Define Function

sirius 2021. 3. 18. 10:19

1. 함수 선언식 (function 키워드를 이용하는 방법)

function hello(name) {
    console.log(name);
}

hello('yujin');

 

2. 함수 표현식(함수 리터럴을 이용하는 방법)

var hello = function(name) {
    console.log(name);
};

hello('yujin');

데이터를 만드는 방식에는 리터럴 방식과 객체 방식 두가지가 있다.

리터럴 방식으로 선언하면 객체방식으로 자동 변환되어 실행된다.

 타입 리터럴 방식  객체 방식 
숫자  var age = 10;  var age = new Number(10); 
문자  var name ='yujin';  var name = new String('yujin'); 
불린  var hot = true;  var hot = new Boolean(true); 
배열  var array = ['data1', 'data2', 'data3', 'data4'];  var array = new Array('data1', 'data2', 'data3', 'data4'); 
//함수 일반적인 방식
function hello(name) {
    console.log(name);
};

hello('yujin');

//함수 리터럴 방식
var hello = function(name) {
    console.log(name);
}

hello('yujin');

//객체 방식
var hello = new Function('name', 'console.log(name)');

hello('yujin');
//리터럴 방식으로 클래스의 멤버함수를 만들 때
var class = {
    test:function() {

    }
}

//Object 방식으로 클래스의 멤버함수를 만들 때
function class = {
    this.test = function() {

    }
}

//prototype 방식으로 클래스의 멤버 함수를 만들 때
function class = {

}

class.prototype.test = function() {
    
}

 

3. Function 객체를 이용

//객체 방식
var hello = new Function('name', 'console.log(name)');

hello('yujin');

 

4. 익명 함수

var hello = function(str) {
    console.log(str);
}
hello('hello'); 

(function(str) {
    console.log(str);
}('hello'));

함수 표현식은 함수를 정의하고,, 변수에 함수를 저장하고 실행하는 과정을 거치지만 익명함수는 즉시 실행된다.

즉시실행 함수를 변수에 할당하면 즉시실행함수 내에서 선언한 변수를 외부에서도 접근할 수 있다.

변수의 접근 범위가 함수 내부에서만 접근하는 것이 아니라 외부에서도 접근이 가능하다.

즉시실행 함수는 글로벌 네임스페이스에 변수를 추가하지 않아도 되기 때문에 플러그인이나 라이브러리 등을 만들 때 많이 사용된다.

var person = (function() {
    var _age = 10;
    var _hello = function() {
        console.log('hello');
    }
    
    return {
        age : _age,
        hello : _hello
    }
}());
console.log(person.age); 
person.hello(); 
person.age = 20;
console.log(person.age);

'JavaScript > 이론' 카테고리의 다른 글

[Javascript] Clouser  (0) 2021.03.18
[Javascript] 콜백, 비동기  (0) 2021.03.18
[Javascript] Array  (0) 2021.03.18
[Javascript] Date  (0) 2021.03.18
[Javascript] String  (0) 2021.03.18
Comments