TIL30 - JavaScript Replit Assignment [vol.6]

오지수·2021년 6월 14일
0

JavaScript

목록 보기
17/18
post-thumbnail

26. Object(2)

::Assignment::

getAnswer 함수를 구현해 주세요.

getAnswer 함수는 아래의 객체에서 '샐러드' 라는 값을 출력합니다.

let myProfile = {
  name: '김개발',
  address: {
    email: 'geabal@gmail.com',
    home: '위워크'
  },
  'my favorite': {
    food: [{
      name: '샐러드',
      price: 3500
    }, {
      name: '삼겹살',
      price: 15000
    }],
    hobby: ['축구']
  }
}

My code

function getAnswer() {
  return myProfile['my favorite'].food[0].name;
}
  • 띄어쓰기 한 키는 []를 사용하여 값에 접근할 수 있다.

Result


27. [ES6] arrow function

  1. function 키워드를 사용하여 표현된 welcome 함수를, 화살표 함수 표현으로 바꿔주세요.
function welcome(name){
  return "안녕하세요" + name
}
  1. 이후, 화살표 함수로 표현된 handleBio 함수를, function 키워드를 사용하여 표현된 함수로 바꿔주세요.
const handleBio = (nickname, bio) =>  {
  const user = {
    nickname : nickname,
    bio : bio,
  }
   return user;
}

My code

Assignment 1

const welcome2 = name => "안녕하세요" + name;

Assignment 2

function handleBio(nickname, bio) {
  const user = {
    nickname : nickname,
    bio : bio,
  }
   return user;
}

Result


28. [ES6] template literals, string method

::Assignment::

handleEdit 함수를 구현해 주세요.

  • 쇼핑몰 회원가입에서 한 번 쯤은 아래와 같은 문구를 보셨을 겁니다.
환영합니다. 위코드님!
회원가입 기념으로 쿠폰을 적립해 드렸습니다.

이러한 문구에서는 이름 부분만 계속 바뀌고 나머지 부분은 고정됩니다. 그럼, 이름 부분을 변수로 관리 하겠죠?

  • 그렇다면 handleEdit 라는 이름을 가진 함수를 구현해 봅시다.
  • 이 함수는 nickname, interests 라는 두 string을 인자로 받습니다. nickname은 유저의 닉네임을, interests 는 유저의 관심사를 의미합니다.
  • interests 에는 여러 관심사를 적을 수 있습니다. 그 때 그 관심사의 구분을 콤마(,)를 이용합니다.
  • nickname 과 interests 가 문제 없이 잘 들어왔다면 유저 정보를 효율적으로 관리하기 위해서 Object에 이 정보를 담아서 관리할 겁니다.
  • 예를 들어 입력 값이 nickname = "뚜비" , interests = "방탈출,테니스,멍 때리기" 라고 했을 때
  • 아래와 같은 Object를 리턴하도록 구현해 주세요.
  • 주의⚠️
    • interests 는 배열입니다.
    • interests 를 적을 때 콤마(,) 뒤에 스페이스는 지워주세요.
{
    nickname: "뚜비",
    interests: ["방탈출","테니스","멍 때리기"],
    bio: "제 닉네임은 뚜비입니다. 취미는 방탈출,테니스,멍 때리기입니다."
}

My code

const handleEdit = (nickname, interests) => {
  if ((nickname != undefined) && (interests != undefined)){
    const info = {
      nickname,
      interests: interests.split(','),
      bio: `제 닉네임은 ${nickname}입니다. 취미는 ${interests}입니다.`
      };
    return info;
  }
}
  • nickname과 interest가 문제없이 잘 들어왔다면 객체의 값에 저장
  • interests는 split으로 잘라 배열로 저장되도록 한다.

Result


29. array method

::Assignment::

두 문제 모두 map 메서드와 arrow function을 사용해주세요.

1. moreThan100 함수를 구현해 주세요.

  • 숫자로 구성된 배열을 인자로 받습니다.
  • 100 보다 크거나 같으면, true 를
  • 100 보다 작으면 false 로 요소를 변경하여, 새로운 배열을 return 해주세요.
  • 예를 들어,
nums(input)[100, 9, 30, 7]
이라면

return[true, false, false, false]

2. formatDate 함수를 구현해 주세요.

  • 날짜가 담긴 배열을 인자로 받습니다.
  • 날짜의 data type은 string이며, 보내는 날짜 타입은 'YYYY-MM-DD' 입니다.
  • 해당 날짜의 형식을 'YYYY년 MM월 DD일' 로 바꿔서, 새로운 배열을 return 해주세요.
  • 예를 들어,
dates(input)['2019-03-21', '2019-04-21', '2019-05-21']
이라면

return['2019년 03월 21일', '2019년 04월 21일', '2019년 05월 21일']

My code

moreThan100

version 1

const moreThan100 = nums => {
  return nums.map(num => {
    if (num >= 100) {
      return true;
    } else {
      return false;
    }
  });
};

version 2

const moreThan100 = nums => {
  return nums.map(num => {
    if (num >= 100) return true;
    else return false;
    }
  );
};

formatDate

const formatDate = dates => {
  return dates.map(el => {
    const line = el.indexOf('-');
    const year = el.slice(0, line);
    const month = el.slice(line + 1, line + 3);
    const date = el.slice(line + 4, el.length);
    const result = `${year}${month}${date}`;

    return result;
  });
}

Result


30. Object(3)

⭐️ 여러 방식으로 풀 수도 있고 배열과 객체에 대한 개념이 확실치 않아서 많이 헷갈렸던 문제였다.

::Assignment::

아래 설명을 읽고 getExamResult 함수를 구현하세요.

인자 scores 는 다음과 같은 객체입니다. 객체의 요소의 갯수 및 키의 이름들은 달라질 수 있습니다. 객체의 값은 다음 9가지 문자열 중에서 하나를 가지고 있습니다.

  • 'A+', 'A', 'B+', 'B', 'C+', 'C', 'D+', 'D', 'F'
{
  '생활속의회계': 'C',
  '논리적글쓰기': 'B',
  '독일문화의이해': 'B+',
  '기초수학': 'D+',
  '영어회화': 'C+',
  '인지발달심리학': 'A+',
}

인자 requiredClasses 는 다음과 같이 문자열로 된 배열입니다.

['영어회화', '기초수학', '공학수학', '컴퓨터과학개론']

다음 조건을 만족하는 객체를 리턴하도록 함수를 구현해주세요.

  1. scores 객체가 가지고 있는 키들은 새로운 객체에 포함되어야 합니다. 단, 그 값들은 다음 원리에 따라 숫자로 바뀌어 할당되어야 합니다.

    • A+ => 4.5
    • A => 4
    • B+ => 3.5
    • B => 3
    • C+ => 2.5
    • C => 2
    • D+ => 1.5
    • D => 1
    • F => 0
  2. requiredClasses 배열의 요소로는 존재하지만, scores의 키로는 존재하지 않는 항목이 있다면, 해당 요소는 새로운 객체의 키가 되고, 값으로 0을 가져야 합니다. 위에서 예시로 묘사된 객체와 배열이 인자로 들어왔다면, 다음과 같은 객체과 리턴됩니다. 요소간 순서는 다를수 있지만, 채점에 무관합니다.

{
  '생활속의회계': 2,
  '논리적글쓰기': 3,
  '독일문화의이해': 3.5,
  '기초수학': 1.5,
  '영어회화': 2.5,
  '인지발달심리학': 4.5,
  '공학수학': 0,
  '컴퓨터과학개론': 0,
}

My code

version 1

const getExamResult = (scores, requiredClasses) => {
  // 새로운 빈 객체
  const newScores = {};
  //객체 키, 값 배열 안의 배열로 받기
  const entries = Object.entries(scores);
  //entries에서 키와 학점을 숫자로 변형한 값 변수에 저장
  const newKeys = entries.map(el => el[0]);
  console.log(newKeys);
  const newValues = entries.map(el => {
    switch (el[1]) {
      case 'A+':
        return 4.5;
        break;
      case 'A':
        return 4;
        break;
      case 'B+':
        return 3.5;
        break;
      case 'B':
        return 3;
        break;
      case 'C+':
        return 2.5;
        break;
      case 'C':
        return 2;
        break;
      case 'D+':
        return 1.5;
        break;
      case 'D':
        return 1;
        break;
      default:
        return 0;
        break;
    }
  });
  // 배열을 쓰면은 인덱스 값이 쭉 출력됨
  // 배열에 키, value 저장
  for (let index in newKeys) {
    newScores[newKeys[index]] = newValues[index];
  }
  // requiredclasses에 존재하지 않는 키는 값을 0으로 해서 객체에 저장하기
  for (let index in requiredClasses) {
    if (newKeys.indexOf(`${requiredClasses[index]}`) === -1) {
      newScores[requiredClasses[index]] = 0;
    }
  }
  return newScores;
}
  • 짜고 보니 코드가 너무 길다..🥲
  • 그래서 객체에 먼저 학점들을 저장해 놓고 위의 방법과는 다른 방법으로 접근해 보았다.

version 2

const getExamResult = (scores, requiredClasses) => {
  let newObj = {};
  let scoresKeys = Object.keys(scores);
  const scoresValue = Object.values(scores);
  // 학점 정보가 담겨 있는 객체
  const changeValue = {
    'A+': 4.5,
    'A': 4,
    'B+': 3.5,
    'B': 3,
    'C+': 2.5,
    'C': 2,
    'D+': 1.5,
    'D' : 1,
    'F' : 0
  };
  
  for (let i in scoresValue) {
    const key = scoresKeys[i];
    const value = scoresValue[i];
    const newValue = changeValue[value];
    
    newObj[key] = newValue;
  }
  
  //필터, 배열 파라미터의 값에 객체에 포함되지 않는 키가 있다면 키를 추가, value는 0
   for (let index in requiredClasses) {
     let element = requiredClasses[index];
    
     if (scoresKeys.includes(element) === false) {
       newObj[element] = 0;
     }
   }
  
  return newObj;

}
  • requiredClasses 배열의 요소로는 존재하지만 scores 키로는 존재하지 않는 항목을 검사할 때 위의 코드보다 조금 더 쉽게 표현하는 방식이 있을 것 같았다.

version 3

  • 굳이 include를 사용하지 않고 newObj[element]가 없다는 것을 조건으로 해도 결과는 같게 출력된다.
// 이 위는 똑같다.
for (let index in requiredClasses) {
    let element = requiredClasses[index];
    
    if (!newObj[element]) {
      newObj[element] = 0;
    }
  }

Result

profile
My Moto:: 내 스스로와 더불어 주변에게도 좋은 영향을 행사하도록 점검 & 노력..!!

0개의 댓글