티스토리 뷰

🔖  객체

사전적인 의미는 
실세계에 존재하는 대상 또는 생각할 수 있는 어떤 개념

🔍 자바스크립트에서의 객체란?

값 또는 기능을 가지고 있는 데이터
즉, 소프트웨어적 사물로써 어떤 사물이나 개념을 소프트웨어적으로 표현하기 위해 사용하는 문법적 수단이다.

 

🏷️ 최초의 객체 : 웹 브라우저

웹 브라우저는 소프트웨어에 세계에 존재하는 사물, 즉 객체이다.

자바스크립트는 웹 브라우저라는 객체에게 명령을 내리기 위해 사용하는 언어로,

사용자가 웹 브라우저에게 명령을 내릴수 있도록 돕기 위해 웹 브라우저와 관련된 다양한 객체들을 제공한다.

그 중 대표적인 객체는 window객체이다.

📎 자바스크립트 코드 내에서 window를 입력하면 웹 브라우저에 접근할 수 있다.

 


🏷️  객체 사용하기

객체는 값 또는 기능을 가지고 있는 데이터를 의미하므로 뒤에 .을 찍어 값 또는 기능을 사용할 수 있다.

( 객체가 가진 기능을 '메소드'라고 한다.)

객체.데이터
// 객체가 가지고 있는 숫자나 문자 등 다양한 데이터를 사용할 수 있음

객체.메소드()
// 객체가 가지고 있는 다양한 기능을 수행할 수 있음

🔗 window객체를 사용해보자.

// window를 입력하면 웹 브라우저에 접근해 무언가를 하겠다는 것을 의미
window.데이터
window.메소드()
// window객체가 가진 값이나 기능을 사용할 수 있음

// alert(경고창) 띄우기
window.alert();
// alert(경고창) 내부에 내용 추가하기
window.alert('hello'); // ''로 묶어서 입력

// 여기서 window.은 생략해도 정상적으로 동작한다.

🔗 window.prompt()

사용자로부터 문자열을 입력받을 수 있는 다이얼로그 박스를 열어주는 메소드

()안에 문자열을 입력하면 다이얼로그 박스안의 메세지로 띄워진다.

 

📌 prompt메소드는 입력창을 표시해두어 사용자가 입력한 값을 가져올 수 있다.

이 때 사용자가 입력한 값은 문자열로 처리되어 prompt메소드에 의해 반환이 된다.

❓ 반환이란

   -> 메소드가 사용된 자리가 다른 데이터로 바뀌게 된다는 것을 의미

즉, 메소드가 문자열로 바뀌게 된다.

※ 실제로 코드가 바뀌는게 아닌 마치 바뀐것 처럼 실행된다는 의미

const message = '프롬프트에 표시할 문자열';

// prompt에 입력받아 반환된 값을 result에 대입
const result = prompt(message);
console.log(result);

// prompt는 두 번째 인자로 입력값에 디폴트되는 문자열을 받는다.
const reserv = prompt('예약일을 입력하세요','2023-01-');

prompt는 확인 버튼이 눌리면 코드상에서 자신이 입력받은 값을 반환하고 동작을 종료한다. 

즉, prompt자리에 문자열이 들어가는 것이다.

➡︎ prompt는 입력받은 문자열을 반환해주어 코드에서 활용할 수 있게 해준다.


🔖 변수

데이터에 붙이는 이름표

변수를 이용하면 이름표를 붙여둔 데이터를 기억해두었다가 필요할때 마다 재사용할 수 있다.

(변수를 지정된 데이터 대신 사용할 수 있음)

 

🔍 변수는 어떤 데이터를 기억할까?

변수에는 자바스크립트로 표현할 수 있는 모든 데이터를 저장할 수 있다.
자바스크립트는 다양한 유형의 데이터를 표현하고 사용할 수 있는데, 데이터 유형에 따라 그 사용법이 조금씩 다르다.
데이터 유형을 흔히 '자료형'이라 하며 숫자형, 문자열 등이 이에 속한다.

📌변수는 데이터를 기억하기 위해 사용한다.

한 번에 하나의 데이터만 기억할 수 있으며, 기억하고 있는 값을 재할당을 통해 바꿔가며 사용할 수 있다.

 

 


🏷️ 상수

수식에서는 '변하지 않는 값'을 의미
단 하나의 데이터만을 위해 사용하는 이름표

변수와는 다르게 값의 변경이 불가능하다.

변수처럼 지정된 데이터 대신 사용할 수 있다.

 

⚠️ 상수를 만들때는 선언과 동시에 초기화(데이터 할당)를 해주어야한다.

상수는 자신이 선언될 때 지정된 데이터로 고정되기 때문에 선언만 할 경우 에러가 발생한다.

 

728x90

'코딩 > 코딩노트' 카테고리의 다른 글

HTTP와 HTTPS  (2) 2023.02.01
[JavaScript] - LocalStorage & JSON  (0) 2023.01.28
[JavaScript] DOM  (0) 2023.01.07
HTML정리 - 임베디드 요소  (0) 2022.11.12
HTML정리 - 구조를 나타내는 요소  (0) 2022.11.12