변수의 범위(scope)
자바스크립트에서는 객체, 함수가 모두 변수에 담길 수 있다.
변수의 범위는 해당 변수에 접근할 수 있는 영역이다.
1. 지역변수
함수 내부에서 선언된 변수, { } 영역 내부에서 선언된 변수
지역 변수는 변수가 선언된 영역 내에서 유효하고 그 영역을
벗어나게 되면 메모리에서 사라진다.
2. 전역변수
함수 외부에서 선언된 변수
전역 변수는 프로그램의 어느 영역에서나 접근할 수 있으며
웹 페이지가 닫혀야만 메모리에서 사라진다.
화살표 함수
function 키워드를 사용해서 함수를 만드는 것보다 간단히 표현하여
함수를 선언할 수 있다. 화살표 함수는 항상 익명 함수이다.
const 함수명 = (매개변수1, 매개변수2, ...) => {
호출시 실행할 문장
}
1. 매개변수가 없는 함수
const 함수명 = () => 수행할 영역
2. 매개변수가 있는 함수
- 매개변수가 한개인 경우
const 함수명 = (변수) => 수행할 영역
const 함수명 = 변수 => 수행할 영역
- 매개변수가 여러개인 경우
const 함수명 = (변수1, 변수2, ...) => 수행할 영역
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>함수 - 5</title>
</head>
<body>
<h2>화살표 함수</h2>
<script>
const sayHello = () => console.log("Hello Javascript!")
const add = (x,y) => {
console.log('두 수의 덧셈 함수');
console.log(`${x}와 ${y}의 합을 구합니다!`);
return x+y;
}
sayHello();
console.log(add(10,3));
let num = Number(prompt("숫자를 입력하세요"));
let doing = null;
if(num > 0){
doing = () => alert("양수입니다.")
}
else if(num<0){
doing = () => alert("음수입니다.")
}
else{
doing = () => alert("0입니다.")
}
doing();
</script>
</body>
</html>
객체(Object)
하나하나의 구체적인 대상을 객체라고 부른다.
여러 변수와 메소드들을 통합적으로 가지고 있다.
변수 : 객체가 가져야 할 속성, 성질, 데이터 저장
메소드 : 객체가 해야할 행위, 기능 저장
프로퍼티(property)
객체 내부의 변수 또는 함수(메소드)
변수 -> 프로퍼티 / 함수 -> 프로퍼티 메소드
객체의 선언
1. 리터럴 표기법
const 객체명 = {} //빈 객체
const 객체명 = {
프로퍼티1:값1,
프로퍼티2:값2,
...
메소드명:function(){
수행할문장
...
},
...
}
2. 생성자를 이용한 객체 생성
new 연산자를 사용하여 객체를 생성하고 초기화 할 수 있다.
생성자는 메소드이며, 이 메소드는 새롭게 생성되는 객체를
초기화하는 역할을 한다.
function 생성자명(매개변수1, 매개변수2, ..){
수행할 문장
this.프로퍼티1 = 매개변수1값;
this.프로퍼티2 = 매개변수2값;
...
}
3. 클래스를 이용한 객체 생성
class 클래스명 {
constructor(매개변수1, 매개변수2, ...){
this.프로퍼티1 = 매개변수1값;
this.프로퍼티2 = 매개변수2값;
...
}
메소드명(매개변수1, 매개변수2, ..){
수행할 문장
...
}
...
}
this
현재 접근중인 객체를 담는 일종의 변수
객체 선언시 메소드에서 this.프로퍼티 로 접근하면
그 메소드를 가지고 있는 현재 객체의 그 프로퍼티로
접근하게 된다. 메소드에서 현재 객체의 프로퍼티를
이용하고자 할 때 this를 사용한다.
'Language > JavaScript(web)' 카테고리의 다른 글
| [javascript] 노드(node) 추가, 생성, 제거, 복제 (0) | 2023.06.07 |
|---|---|
| [javascript] 프로토타입, 객체종류, 콜백 함수 (0) | 2023.06.07 |
| [javascript] 제어문, 배열, 함수 (1) | 2023.06.07 |
| [javascript] 연산자, 제어문 (0) | 2023.06.07 |
| [javascript] 대화상자, 연산자 (0) | 2023.06.07 |
