JS 기초편(2)

개요: 필자가 공부하면서 정리한 게시물이다. 

 

<function>

function sayHello(){

   

    console.log("hello");

}

sayHello();

기본적인 구조는 다음과 같다. 

 

function sayHello(nameOfPerson){

   

    console.log(nameOfPerson);

}

sayHello("a");

인자 전달방식은 다음과 같다. 

function sayHello(nameOfPerson){

   

    console.log(nameOfPerson);

}

sayHello("1");

sayHello("1");

sayHello(15);

숫자로도 가능하다. 

function sayHello(nameOfPerson,age){

   

    console.log(nameOfPerson+age);

}

sayHello("승호",24);

sayHello("세현",26);

결과는 다음과 같다. 

 

const player={

    name: "승호",

    sayHello: function(){

        console.log("hello");

    },

};

console.log(player.name);

player.sayHello();

다음과 같이 object안에서도 함수를 만들 수 있다. 

 

const calculator={

plus: function(a,b){

    console.log(a+b);

},

minus: function(a,b){

    console.log(a-b);

},

times: function(a,b){

    console.log(a*b);

},

divide: function(a,b){

    console.log(a/b);

},

power: function(a,b){

    console.log(a**b);

},

};

calculator.plus(3,2);

calculator.minus(3,2);

calculator.times(3,2);

calculator.divide(3,2);

calculator.power(3,2);

응용편이다. 구조를 잘 기억해두자 

 

const age=96;

function calculateKrAge(ageOfForeigner){

    return ageOfForeigner +2;

}

const krAge=calculateKrAge(95);

console.log(krAge);

return 해서 함수값을 넘길 수 있다. 

 

<HTML과 JS의 연결>

const age =prompt("how old are you");

console.log(age);

prompt함수를 통해 html 뜰 수 있다. 다음과 같이 뜨는데 입력하면 콘솔창에 입력한 값이 뜬다 . 신기신기!!

하지만 자바스크립트 코드를 멈추게해서 사용하지 않는다고 한다. 그리고 css 적용도 못한다. 

 

const age =prompt("how old are you");

console.log(typeof age);

콘솔에 string이라고 뜬다. 

 

const age =prompt("how old are you");

console.log(typeof age + typeof parseInt(age));

parseInt 때문에 string number이라고 뜬다. 

 

const age =parseInt(prompt("how old are you"));

문자를 입력했을시 콘솔창에 NAN이 뜬다. 

console.log(isNaN(age));

숫자를 집어넣으면 false가뜬다. nan은 Not a Number

 if(isNaN(age)){

console.log("숫자로 써줘");

 }

문자로 입력하면 값이 true이기 때문에 다음과 같은 문구가 뜬다.