[JS 기초 Day 3] 함수의 기초

[함수]

 

(+)

1. 편리함<-함수 호출만으로 해결됨

2. 유지.보수가 쉬움

 

// 함수 작성

function showError(){
  alert("에러가 발생했습니다. 다시 시도해주세요.");
}

showError();

 

// 함수 작성
//매개변수가 있는 함수

function sayHello(name){
  const msg =`Hello, ${name}`;
  console.log(msg);
}

sayHello(`Mike`);
sayHello(`Tom`);
sayHello(`Jane`);

 

// 함수 작성
//매개변수가 있는 함수

function sayHello(name){
  
  //msg는 지역변수 함수 외부에서 사용하려면 
  //바깥으로 빼줘야함
  let msg =`Hello, `;
  if(name){
    msg += name;
  }
  console.log(msg);
}

sayHello();
sayHello(`Mike`)

 

//매개변수가 있는 함수 작성
//전역 변수(global variable)
// 함수 밖에 위치해서 어디서든 접근 가능!
let msg="Hello";

console.log("함수 호출 전")
console.log(msg)

function sayHello(name){
  if(name){
    msg+=`, ${name}`;
  }
  console.log("함수 내부")
    console.log(msg);
}

sayHello("Mike");
console.log("힘수 호출 후");
console.log(msg)

 

//지역변수와 전역변수

let msg="welcome"; //전역
console.log(msg)

function sayHello(name){
  let msg="Hello"  //지역
  console.log(msg +' '+ name);
}
sayHello("Mike");
console.log(msg)

전역 변수와 지역 변수가 서로 간섭을 받지 않는다는 것을 알 수 있음

 

//OR

function sayHello(name){
  let newName=name || "friend";
  let msg = `Hello, ${newName}`
  console.log(msg)
}

sayHello();
sayHello("Jane");

//default value

//name이 없을 때만 디폴트 값이 할당됨
function sayHello(name = "friend"){
  let msg = `Hello, ${name}`
  console.log(msg)
}

sayHello();
sayHello("Jane");

 

//return으로 값 반환

function add(num1,num2){
  return num1 + num2;
}

const result=add(2,3);
console.log(result)

-> 5

 

//return으로 값 반환

function showError(){
  alert("에러가 발생했습니다.");
  return;
}

const result=showError();
console.log(result);

에러가 발생했다는 안내 문구의 alert 창이 뜨고 콘솔 창에는 undefined가 출력된다.

---

• 한 번에 한 작업에 집중
• 읽기 쉽고 어떤 동작인지 알 수 있게 네이밍

ex.

showError //에러를 보여줌

getName //이름을 얻어옴

createUserData //유저데이터 생성

checkLogin //로그인 여부 체크