프론트엔드 스쿨 5기 TIL - 4월 4일 - Object & function

크롱·2023년 4월 6일
0

JavaSrcipt

목록 보기
12/53

🌈 Object

  • 배열처럼 여러개의 데이터를 한 변수에 저장할 수 있는 자료형
  • 객체는 특별한 키(key)를 통해 원하는 값(value)에 접근 할 수 있는 키-값 쌍으로 이루어져 있다
  • 키 값 쌍을 합쳐서 속성(attribute)이라 표현. 만약 속성의 값이 함수인 경우에는 메소드라고 부릅니다.
<script>
  const human = {
      name: "hojun",
      age: 53,
      from: "korea",
      askingHim: function () {
          console.log("hello world!");
      },
      0: '01050442903'
  };
  
  human.name //"hojun"
  human['age'] //53
  
  human['0'] // '01050442903'
  human[0] // '01050442903' 콘솔로그하면 0이 맨처음에 위치해있음
  
  human.name = 'jun' // console.log(human)해보면 이름이 'jun'으로 바껴있다.
  
  delete human.age; //프로퍼티 삭제
  
  //프로퍼티 존재여부 확인
  console.log('age' in human); // true
  
  
  //객체의 메소드
  human.hasOwnProperty('askingHim'); // true // 중요!
  
  console.log(Object.keys(human))
  //['0', 'name', 'age', 'from', 'askingHim']
  
  console.log(Object.values(human))
  // ['01050442903', 'hojun', 53, 'korea', ƒ]

</script>

🌈 function

<script>
  function 함수이름(parameter1, parameter2...) { // 함수의 선언
      // 실행코드...
      return 반환값
  }

  함수이름(argument1, argument2...) // 함수의 호출
</script>
  • 파선아실(파라미터는 선언, 아규먼트는 실제 값)
  • 함수 내부에서 return 구문을 만나게 되면 해당 함수는 종료됩니다.

🌞 함수 선언문

<script>
	function one(a, b) { 
    let z = a + b 
    return z ** 2 
}
console.log(one(7, 3)) // 100
</script>

🌞 함수 표현식

이름없이 선언하는 함수

<script>
const three = function (a, b) { 
    let z = a + b 
    return z ** 2 
}

console.log(three(7, 3)) //100
</script>

🌞 화살표 함수

<script>
  const two = (a, b) => (a + b) ** 2
  console.log(two(7, 3)) //100
  
  -----------
  //짱중요!🌞
  
  function 함수1(x, y) {
    return x + y
}
  // 위 함수를 화살표 함수로 작성하면 아래와 같습니다.
  let 함수1 = (x, y) => x + y

  // 만악 함수 실행시 전달하는 인자가 한 개라면 소괄호를 생략할 수 있습니다.
  let 함수2 = x => x + 10

  // 화살표 함수 내부에서 한 줄 표현식만 반환한다면 return 키워드를 생략해도 됩니다.
  let 함수3 = x => x + 10
  
  ------------------
  let sum = (a, b) => {  // 중괄호는 본문 여러 줄로 구성되어 있음을 알려줍니다.
     let result = a + b;
     return result; // 중괄호를 사용했다면, return 지시자로 결괏값을 반환해주어야 합니다.
  };

</script>

예시

<script>
 const numbers = [1, 2, 3, 4, 5];
 const squaredNumbers = numbers.map(number => number * number);

 console.log(squaredNumbers); // [1, 4, 9, 16, 25]
 
 ----------------------
 
 
 const numbers = [1, 2, 3, 4, 5];
 const oddNumbers = numbers.filter(number => number % 2 !== 0);

 console.log(oddNumbers); //[1, 3, 5]
</script>


  • 주어진 배열에서 홀수인 수만 모두 더하는 함수를 작성하세요. 단, 화살표 함수를 사용하여 구현하세요.
<script>
  const sumOddNumbers = (arr) => {
    return arr.filter(num => num % 2 !== 0).reduce((acc, cur) => acc + cur, 0);
  }

  console.log(sumOddNumbers([1, 2, 3, 4, 5])); // 9
</script>
profile
👩‍💻안녕하세요🌞

0개의 댓글