[TIL]231025_JS복습가이드(+좌절 한스푼...) / 보충강의

ㅇㅖㅈㅣ·2023년 10월 25일
4

Today I Learned

목록 보기
12/93
post-thumbnail

(작성중)

JS 문법종합반 강의듣기 ➡️ 개인과제작업 후 어려움을 겪는 사람들 속출....

솔루션 : 자바스크립트 복습 가이드를 통한 진단


✍🏻 자바스크립트 복습 가이드 1단계 : 함수이해도 평가

문제1

// [요구사항]
// 아래 함수 multiply는 두 인자를 받아 곱한 값을 반환합니다. 해당 함수를 완성하십시오.

// [코드]
function multiply(a, b) {
  return a * b;
}
console.log(multiply(2, 3));
// 여기에 코드를 작성하세요. 

// [테스트]
// multiply(2, 3)은 6을 반환해야 합니다.

문제2

// [요구사항]
// 주어진 숫자 배열의 모든 요소를 더하는 함수 sumArray를 작성하세요.

// [코드]
const sumArray = [1, 2, 3, 4, 5];
let sum = 0;
for (let i = 0; i < sumArray.length; i++) {
  sum += sumArray[i]; // 여기에 코드를 작성하세요.
}
console.log(sum);

// [테스트]
// sumArray([1, 2, 3, 4, 5])은 15를 반환해야 합니다.

(이거 다시풀어야 함!!)

🏥 진단 🏥

3개 중 2개 이상 풀지 못하였다면 당신은? 🤔
✓ 진단명 : 함수 울렁증
✓ 진단내용: 함수의 정의, 매개변수의 이해, 반환 값의 개념에 어려움을 겪음. 기본적인 함수 호출 및 함수의 작동 방식에 혼란을 느낌.
✓ 솔루션 : 자바스크립트 1주차 1-6(연산자) ~ 1-8(스코프 및 화살표함수) 복습

난 함수 울렁증이었던 것이다....


📚 보충반 강의

함수

//함수 = input / output
//함수를 선언
//인자(parameter) = input

function (인풋) {
    return 아웃풋
}

var a = function (인풋) {
    return 아웃풋
}
console.log(type of a) //object


1. 인자를 3개 받아서, 모든 값을 더해서 출력하는 함수
    var func01 = function (a, b, c) {
        return a + b + c;
    }
    console.log(func01(1, 2, 3));

2. 인자를 2개 받아서 모든 값을 곱해서 출력하는 함수
    function (a, b) {
        return a * b;
    }
    console.log(3, 4);

3. 인자를 4개 받아서 console.log에 합을 출력하고 아웃풋은 없는 함수
    function (a, b, c, d) {
        console.log(a + b+ c + d);
    }

-----------------------------------------
    var testFunc = function (a, b) {
        console.log(a + b);
      
        return a * b;
    }
    var results = testFunc(2, 3);
    console.log(results);  //5아니고 6출력

반복문, 배열

//for 반복문
const arr = [1, 2, 3, 4, 5];
for (i = 0; i < arr.length; i++) {
  console.log(`${arr[i]}입니다.`);
}

//forEach() 메소드
const arr01 = [1, 4, 2, 3, 10, 15, 0];
arr01.forEach(function (value, index) {
  console.log(`value = ${value}`);
  console.log(`index = ${index}`);
  console.log("---------------");
});

//filter() 메소드
const arr01 = [1, 4, 2, 3, 10, 15, 0];
//arr01에 있는 요소 중에서 5이상인 값을 이용해서 새로운 배열 만들기
arr01.filter(function(, 순서) {
    console.log();
});

//filter는 조건에 맞는것만 필터링한다
const arr01 = ["홍길동", "홍길순", "옹길순"];
let result = arr01.filter(function (value) {
  if (value.includes("홍길")) {
    return true;
  } else {
    return false;
  }
});
console.log(result);

//위에 코드를 화살표함수로 조금 더 간단하게 작성
const arr01 = ["홍길동", "홍길순", "옹길순"];
const result = arr01.filter((val) => val.includes("홍길"));
console.log(result);

//map() 메소드 -> 배열의 각 요소에 대해 다 할당이 되어 콜백함수를 실행하고 결과를 새로운 배열로 반환
const arr = [1, 2, 5, 10, 4];

const result = arr.map(function (, 순서) {
  return "몇번반복";
});
console.log(result);

체이닝기법

//체이닝기법!!!!!!!!!!!!!

const arr = [1, 2, 3, 10, 4];

const result = arr
    .map(function() {
        return* 2;
    })
    .filter(function() {
        return>= 5;
    })
    .forEach(function() {
        console.log();
    })
    //forEach에서는 return해주는 값이 없기 때문에 .을 찍어도 배열관련 API가 나오지 않음

⭐️복습가이드, 예제30 등 문제 차근차근 풀면서 이해해보자⭐️

profile
웰씽킹_나는 경쟁력을 갖춘 FE개발자로 성장할 것이다.

0개의 댓글