nodejs 시작전 자바스크립트 핵심정리!

자바와 자바스크립트의 변수 타입 비교

자바는 자료형을 명시하는 언어
자바스크립트는 자료를 명시하지 않는 언어
내부에서는 자료형에 따라 변수 상자의 크기가 달라짐

자바와 자바스크립트의 함수 비교

파라미터의 타입과 반환되는 값의 타입을 명시하지 않음
함수 앞에는 function 키워드를 붙임

자바: int add(int a, int b){…}

자바스크립트: function add( a, b){…}

함수를 변수에 할당하기

자바스크립트에서는 함수를 일급 객체로 다룸
따라서, 함수가 변수에 할당될 수 있음
변수에 할당될 경우 두 가지 이름으로 함수를 호출할 수 있으므로 원래의 함수 이름을 생략하고 익명 함수라고 부름

익명함수 예제:

var add=function(a,b){
    return a+b;
}

var result=add(10,10)

객체 속성 예제:

var person={
    name:'소녀시대', //name 속성 이름 : 속성 값
    age:20,
    add:function(a,b){//익명함수
        return a+b;
    }
}

console.log('더하기 :'+ person.add(40,40));

배열

배열 안에 함수를 넣을 수 있다? js에선 신기하다 ㄷㄷ..

var Users2=[{name:'소녀시대',age:20},{name:'걸스데이',age:22}];

var add=function(a,b){
    return a+b;
}

Users2.push(add); 

console.dir(Users2);
console.log('세번째 배열 요소를 함수로 실행: '+ Users2[2](10,10));

for(var i=0;i<Users2.length;i++){
    console.log('배열 원소 #'+i+':'+Users2[i]);
}

실행결과

속성/메서드 이름 설명

push(object)	배열의 끝에 요소를 추가합니다
pop( )	배열의 끝에 있는 요소를 삭제합니다
unshift( )	배열의 앞에 요소를 추가합니다.
shift( )	배열의 앞에 있는 요소를 삭제합니다.
splice(index, removeCount, [Object])	여러 개의 객체를 요소로 추가하거나 삭제합니다.
slice(index, copyCount)	여러 개의 요소를 잘라내어 새로운 배열 객체로 만듭니다.

ex.splice(1, 0, [object]) 뜻 ex [1]에 0개 제거 object내용 추가

ex.splice(1,1) 뜻 ex[1]에 1개 제거 즉 ex[1] 삭제

콜백 함수 이해하기

function add(a,b,callback){
    var result =a +b ;
    callback(result);
}

add(10,10,function(result){
    console.log('더하기 결과(콜백함수 안에서: '+result);
});

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

function add(a,b,callback){
    var result =a +b ;
    callback(result);
    
    var history = function(){
        return a+'+'+b+'=' +result;
    };
    return history;

}

var add_histroy = add(10,10,function(result){
    console.log('더하기 결과: '+result);
});
//지바 스크립트에서는 변수명을 보고 해당 자료형이 무슨 자료형인지 확인이 필요한경우가 있음
console.log('add_history의 자료형: '+ typeof(add_histroy)); // 자료형: 함수
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());//자료형이 함수임으로 함수 부르는것 처럼 실행

클로저(closure) 역할: 내부 함수가 자신을 만들어준 외부 함수 안에 있는 변수의 값을 그대로 유지하면서 참조할 수 있다

아래 예제 참고

function add(a,b,callback){
    var result =a +b ;
    callback(result);
    
    var count = 0 ;
    var history = function(){
        count++;
        return count+':'+a+'+'+b+'=' +result;
    };
    return history;

}

var add_histroy = add(10,10,function(result){
    console.log('더하기 결과: '+result);
});

console.log('add_history의 자료형: '+ typeof(add_histroy));
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());

결과를 보면 count라는 변수가 공유당하고 있음

자바스크립트에서 객체지향 방식으로 만들기

객체의 원형을 프로토타입이라 하고 이 프로토타입이 클래스의 역할을 함
프로토타입을 만들고 new 연산자를 이용해 새로운 객체에서 만들어낼 수 있음

함수가 클래스를 정의하는 목적으로 사용

function Person(name,age){ // 자바에서 생성자 역할? 함수라고 생각 NO
    this.name = name;
    this.age = age;
}

Person.prototype.walk = function(speed){ // 자바에서 메소드 선언 부분이랑 동일 역할
    console.log(speed+ 'km 속도로 걸어갑니다.');
}

var person3=new Person('소녀시대',20); //객체 생성

person3.walk(10);// walk 메소드(함수) 실행

자바와 자바스크립트의 변수 타입 비교

자바는 자료형을 명시하는 언어
자바스크립트는 자료를 명시하지 않는 언어
내부에서는 자료형에 따라 변수 상자의 크기가 달라짐

자바와 자바스크립트의 함수 비교

파라미터의 타입과 반환되는 값의 타입을 명시하지 않음
함수 앞에는 function 키워드를 붙임

자바: int add(int a, int b){…}

자바스크립트: function add( a, b){…}

함수를 변수에 할당하기

자바스크립트에서는 함수를 일급 객체로 다룸
따라서, 함수가 변수에 할당될 수 있음
변수에 할당될 경우 두 가지 이름으로 함수를 호출할 수 있으므로 원래의 함수 이름을 생략하고 익명 함수라고 부름

익명함수 예제:

var add=function(a,b){
    return a+b;
}

var result=add(10,10)

객체 속성 예제:

var person={
    name:'소녀시대', //name 속성 이름 : 속성 값
    age:20,
    add:function(a,b){//익명함수
        return a+b;
    }
}

console.log('더하기 :'+ person.add(40,40));

배열

배열 안에 함수를 넣을 수 있다? js에선 신기하다 ㄷㄷ..

var Users2=[{name:'소녀시대',age:20},{name:'걸스데이',age:22}];

var add=function(a,b){
    return a+b;
}

Users2.push(add); 

console.dir(Users2);
console.log('세번째 배열 요소를 함수로 실행: '+ Users2[2](10,10));

for(var i=0;i<Users2.length;i++){
    console.log('배열 원소 #'+i+':'+Users2[i]);
}

속성/메서드 이름 설명

push(object)	배열의 끝에 요소를 추가합니다
pop( )	배열의 끝에 있는 요소를 삭제합니다
unshift( )	배열의 앞에 요소를 추가합니다.
shift( )	배열의 앞에 있는 요소를 삭제합니다.
splice(index, removeCount, [Object])	여러 개의 객체를 요소로 추가하거나 삭제합니다.
slice(index, copyCount)	여러 개의 요소를 잘라내어 새로운 배열 객체로 만듭니다.

ex.splice(1, 0, [object]) 뜻 ex [1]에 0개 제거 object내용 추가

ex.splice(1,1) 뜻 ex[1]에 1개 제거 즉 ex[1] 삭제

콜백 함수 이해하기

function add(a,b,callback){
    var result =a +b ;
    callback(result);
}

add(10,10,function(result){
    console.log('더하기 결과(콜백함수 안에서: '+result);
});

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

function add(a,b,callback){
    var result =a +b ;
    callback(result);
    
    var history = function(){
        return a+'+'+b+'=' +result;
    };
    return history;

}

var add_histroy = add(10,10,function(result){
    console.log('더하기 결과: '+result);
});
//지바 스크립트에서는 변수명을 보고 해당 자료형이 무슨 자료형인지 확인이 필요한경우가 있음
console.log('add_history의 자료형: '+ typeof(add_histroy)); // 자료형: 함수
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());//자료형이 함수임으로 함수 부르는것 처럼 실행

클로저(closure) 역할: 내부 함수가 자신을 만들어준 외부 함수 안에 있는 변수의 값을 그대로 유지하면서 참조할 수 있다

아래 예제 참고

function add(a,b,callback){
    var result =a +b ;
    callback(result);
    
    var count = 0 ;
    var history = function(){
        count++;
        return count+':'+a+'+'+b+'=' +result;
    };
    return history;

}

var add_histroy = add(10,10,function(result){
    console.log('더하기 결과: '+result);
});

console.log('add_history의 자료형: '+ typeof(add_histroy));
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());
console.log('결과 값으로 받은 함수 실행: '+ add_histroy());

자바스크립트에서 객체지향 방식으로 만들기

객체의 원형을 프로토타입이라 하고 이 프로토타입이 클래스의 역할을 함
프로토타입을 만들고 new 연산자를 이용해 새로운 객체에서 만들어낼 수 있음

함수가 클래스를 정의하는 목적으로 사용

function Person(name,age){ // 자바에서 생성자 역할? 함수라고 생각 NO
    this.name = name;
    this.age = age;
}

Person.prototype.walk = function(speed){ // 자바에서 메소드 선언 부분이랑 동일 역할
    console.log(speed+ 'km 속도로 걸어갑니다.');
}

var person3=new Person('소녀시대',20); //객체 생성

person3.walk(10);// walk 메소드(함수) 실행

느낀 점:

js를 어느 정도 만진다고 생각했는데 생각보다 모르는 게 많아서 알아가는 게 많았던 내용이었다.. callback함수와 객체 생성? 자바스크립트에서 할 수 있었다는 너무 놀라웠던 사실이었다.. 다음에 한번 사용해서 프로그램을 짜 봐야겠다.

'nodejs' 카테고리의 다른 글

[Node.js] 게시판 만들기 (목표설정,사용모듈소개) (0)	2022.09.22
[node.js] 웹서버 만들기 (0)	2022.09.22
로그파일 남기기(winston 모듈 install) (0)	2022.09.12
노드의 기본 기능 알아보기... (0)	2022.09.12
Visual Studio Code에서 Node.js 환경 구축하기 (0)	2022.09.10

ShouldICode

nodejs 시작전 자바스크립트 핵심정리!

자바와 자바스크립트의 변수 타입 비교

자바와 자바스크립트의 함수 비교

함수를 변수에 할당하기

배열

콜백 함수 이해하기

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

자바스크립트에서 객체지향 방식으로 만들기

자바와 자바스크립트의 변수 타입 비교

자바와 자바스크립트의 함수 비교

함수를 변수에 할당하기

배열

콜백 함수 이해하기

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

자바스크립트에서 객체지향 방식으로 만들기

느낀 점:

'nodejs' 카테고리의 다른 글

댓글

티스토리툴바

nodejs 시작전 자바스크립트 핵심정리!

자바와 자바스크립트의 변수 타입 비교

자바와 자바스크립트의 함수 비교

함수를 변수에 할당하기

배열

콜백 함수 이해하기

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

자바스크립트에서 객체지향 방식으로 만들기

자바와 자바스크립트의 변수 타입 비교

자바와 자바스크립트의 함수 비교

함수를 변수에 할당하기

배열

콜백 함수 이해하기

콜백 함수 안에 내부 함수 만들기(history를 알기 위해??)

자바스크립트에서 객체지향 방식으로 만들기

느낀 점:

'nodejs' 카테고리의 다른 글

관련글

댓글

티스토리툴바