[포스코x코딩온] KDT 웹 10기 2주차 | JavaScript(2)-함수, onclick, 조건문, 3항 연산자, 반복문

📖함수

특정 동작(기능)을 수행하는 일부 코드의 집합(부분)

함수 선언문

호이스팅(hoisting)

어디서든 호출할 수 있다.

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

함수 표현식

코드에 도달하면 생성되고 그 이후에 사용가능하다.

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

화살표 함수

//함수 표현식
let sayHello = (name) => {
  console.log(`Hello, ${name}`);

//함수 선언문
function multiply(num1, num2){
  return num1*num2;
}
//함수 표현식
let multiply = function(num1, num2){
  return num1*num2;
}
//화살표 함수
let multiply = (num1, num2) => {
  return num1*num2;
}

---

📖Onclick

클릭 시 발생하는 이벤트로, 각각의 HTML 요소에 속성 값으로 JS 함수를 연결한다.

---

📖조건문

특정 조건 만족 시(조건이 참인 경우) 실행하는 명령의 집합으로, 특정한 조건 속에서 작업을 수행하고 싶을 때 사용한다.

If

if(조건1) {
  //조건1이 참이라면 실행
}else if(조건2) {
  //조건2가 참이라면 실행
}else {
  //조건1과 2가 모두 참이 아닐 때 실행
}

let isShow = true;

if(isShow) {
  console.log('Show!');
}else {
  console.log('Hide?');
}

Switch

switch(변수){
  case 값1:
    //변수와 값1이 일치하면 실행
    break;
  case 값2:
    //변수와 값2가 일치하면 실행
    break;
  default:
    //일치하는 값이 없을 때 실행
    break;
}

3항 연산자

if문을 간단하게 표현하는 방법으로, 한 줄로 간단히 표현할 수 있다.

조건식 ? 조건이 참인 경우 : 조건이 거짓인 경우;

let name = "길동";

if(name==="길동"){
  console.log("맞았어요");
}else {
  console.log("틀렸어요");
}

name!="길동" ? console.log("틀렸어요"):console.log("맞았어요");

---

📖반복문

똑같은 명령을 일정 횟수만큼 반복해 수행하도록 하는 실행문

for문

//for문
for(let index=0; index<10; index++){
  console.log("인사를", i+1, "번째 드립니다!");
}

while문

for문과 달리 조건을 변경하는 구문이 기본적으로 포함되어 있지 않기 때문에 무한 루프 가능, 주의하여 사용 필요

while(조건문) {
  실행할 코드(명령문)
}

반복문 제어

break

반복문을 멈추고 밖으로 빠져나옴

//break
for(let i=0; i<100; i++){
  if(i==0){
    console.log('멈춰!');
    break;
  }
  console.log(i);
}

continue

반복문을 한 번만 멈추고 다음 반복으로 진행

//continue
for(let i=0; i<100; i++){
  if(i%2==0){
    continue;
  }
  sum+=i;
}
console.log(sum);

---

🖇결론

최근에 블로그를 통 못썼다. 초반에는 나름 부지런하게 썼는데 3주차에 밀린거 쓰고 있는거 안비밀.. ㅠㅁㅠ 다시 헤이해진 마음을 바로잡고 열씸히 써야겠다! 그리고 자바스크립트 너무 어려워서 복습 많이 해야할듯 그리고 조만간 팀프로젝트 하니까 이번주는 빡세게 복습하려고 한다 ㅍㅇㅌ