[멋쟁이사자처럼 - 프론트엔드 스쿨 TIL] JavaScript (7)

Today I Learn : 2024-06-04

console.log(object.prototype.hasOwnProperty);

 

// 메서드 빌려쓰기

javaScript.hasOwnProperty.call(a, b);

* call : 

 

객체 뽑아내는법

javaScript['creator'] === javaScript.creator

 

// 점 표기법 : 변수 설정 X

// 대괄포 표비버 : 변수 설정 O

# for...in

- for...in은 객체에게 양보하자

- 배열은 순서 보장이 안됨, 성능↓

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/for...in

for...in - JavaScript | MDN

 

# 

 

Symbol(Symbol.iterator) 메서드가 들어있으면 iterable로 취급한다.

 

객체 나타낼 때

console.table(value) 하면 보기 편하다

 

arrayLike 는 객체

= {

  0 : 'body',

  1 : 'head',

  2 : 'div',

};

 

// 객체를 배열로 만든 후 for...of를 사용한다

 

Object.keys() : 객체들의 키를 모아 하나의 배열로 반환 > for..of로 돌릴 수 있게됨

ex) const keys = Object.keys(arrayLike);

console.log(keys);

for(let value of keys) {

  console.log(value);

}

 

Object.values() : 객체들의 값을 모아 하나의 배열로 반환 > for..of로 돌릴 수 있음

const values = Object.values(arrayLike);

console.log(values);

for(let value of values) {

  console.log(values);

}

 

Obejct.entries() : 객체의 키와 값을 하나의 쌍으로 만들고 이를 배열로 반환  for..of로 돌릴 수 있음

const entries = Object.entries(arrayLike);

console.log(entries);

for(let keyValue of entries):{

  console.log(keyValue);

}

---

스크립트를 작성하다 보면 유사한 동작을 하는 코드가 여러 곳에서 필요할 때가 많습니다. : 재사용

 

함수선언문

 

외부 변수

변수 찾는 순위

1. 함수내부 2. 매개변수 3. 상위스코프 (스코프체이닝)

 

매개변수 = 파라미터 = 인자

 

인수와 인자는 다르다

 

인수=argument show(message())

 

 

함수를 만들 땐 다양한 시각에서 봐야한다

jest

 

const first = document.querySelector('.first');

// first : 객체

first.style

 

ex) color를 pink로 만들 때

first.style.color = 'pink';

 

 

---

# 함수

참고 ) https://ko.javascript.info/function-basics

함수

- 스크립트를 작성하다보면 유사한 동작을 하는 코드가 여러 곳에서 필요할 때 사용된다.

- 일련의 과정을 문(statement)로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다.

 

① 함수 선언 (function declaration, 함수 선언문)

// 함수 선언
function showMessage(parameter1, parameter2, ... paramterN) {
  // 함수 본문
  console.log(parameter1);
}

// 함수 호출
showMessage('안녕하세요!'); // '안녕하세요!'

(1) function 키워드

(2) 함수 이름

(3) 매개변수(parameter, 파라미터)

(4) 함수 본문

② 지역 변수 (local variable)

- 함수 내에서 선언한 변수인 지역변수는 함수 안에서만 접근 할 수 있다.

예시 )

function showMessage() {
  let message = '안녕하세요!'; // 지역 변수
  
  console.log(message);
}

showMessage(); // '안녕하세요!'

③ 외부 변수 (outer variable)

- 함수 내부에서 함수 외부의 변수인 외부 변수에 접근할 수 있다.

- 외부 변수는 지역 변수가 없는 경우에만 사용할 수 있다.

let userName = 'kim';

function showMessage(parameter) {
  let message = parameter + userName;
  console.log(message);
}

showMessage('Hello '); // 'Hello Kim'

let userName = 'Kim';

function showMessage() {
  let userName = 'Lee';
  
  let message = 'Hello, ' + userName; // Lee
  console.log(message); 'Hello, Lee'
}