지역변수,전역변수 개념과 자바스크립트의 객체(Object)

스터디/자바스크립트

지역변수,전역변수 개념과 자바스크립트의 객체(Object)

고무곰(GomuGom) 2017. 8. 10. 17:26

- 자바스크립트의 지역변수와 전역변수 개념

=> 함수내에 선언된 변수만 지역변수!! 그 외에는 다 전역변수이다. 즉, 함수내에 선언된게 아니면

어떠한 블럭이건 for문 안에서건 전부 전역변수이다.

{

var param = 10;

}

이것도 어면히 전역변수

var f = function(){

var str = "string";

}

이 str변수는 지역변수

[ 자바스크립트의 객체(Object)에 대해서]

<!DOCTYPE html>

// 일반적인 객체 생성 방법(선언과 동시에 생성)
	var studentObj = {
		// 필드
		name : "황영롱",
		age : 28,
		// 메서드
		sayHello : function(){
			// 객체 내의 필드변수에 접근할 때는 반드시 this키워드를 써줘야한다.(자바와 다름...생략 불가)
			return this.name + "입니다. 안녕하세요.";
		}
	}

alert(studentObj.name + "입니다. " + studentObj.sayHello());

var students = [];
	// 배열에 객체 추가
	students.push(studentObj);

// 객체명을 생략해 편리하게 이용하도록 도와주는 with
	// 본래 아래와 같이 필드변수에 접근해야한다.
	console.log( studentObj.name + studentObj.age );
	// 하지만... width를 쓰면 다음처럼 접근할 수 있다.
	with(studentObj){
		console.log( name + age );
	}

// 매번 객체에 값을 넣어논 상태로 생성하는 것이 불편하기 때문에 생성자를 이용해 객체를 생성하도록 한다.
	function Student(name,age,kor,math){
		
		this.name = name;
		this.age = age;
		this.kor = kor;
		this.math = math;

this.getSum = function(){
			return (this.kor + this.math);
		}

this.toString = function(){
			return ("이름 : " + this.name + "나이 : " + this.age + "합계 : " + this.getSum() );
		}

}

// 객체 생성
	var s1 = new Student("홍길동",20,100,98);
	// 메서드 호출
	alert(s1.toString());

// 이런 객체 생성방식에서 필드변수의 값은 매번 다를 수 있지만 함수는 매번 똑같기 때문에
	// 매번 메모리를 잡아먹으면 낭비가 된다. 따라서 생성자 함수 정의시 필드 변수만 넣고 메서드는 prototype 객체에 넣도록 한다.
	// prototype 객체는 모든 객체가 공통으로 가지는 객체이다. 이 prototype에 메서드를 등록해서 사용한다.

function Car(name,color){
		this.name = name;
		this.color = color;
		// 필드 변수만 기재한다. 메서드는 따로 prototype에 등록한다.
	}
	// 프로토타입에 메서드 등록
	Car.prototype.performance = function(){
		return this.name + "의 차이며 색상은 : " + this.color + "입니다.";
	}
	Car.prototype.newParam = 10;

var c1 = new Car("아반떼","검정");
	var c2 = new Car("소나타","레드");
	alert(c1.performance());
	alert(c2.performance());

// 이 경우 c1과 c2에 본래 performance메서드가 각각 메모리에 잡히게 되고 만약 이런 객체를 100개를 만들면 100개의 공간이잡힐 것이다.
	// 하지만, 둘 다 공유할 수 있는 prototype이라는 객체에 메모리를 할당해 놓고 두 객체는 이 공간을 공유해 사용하게 되서 메모리를 절약할 수 있게 되는 것이다.
	// 만약, 메서드뿐 아니라 필드변수값도 공유하고 싶다면 아래와같이 할 수 있다.
	// Car.prototype.newParam;
	
	alert("c1의 값 : " + c1.newParam); // 10
	// 이건 공통 prototype에서가 아니라 새로 생성한 것
	c1.newParam = 20;
	// c1, c2 공통으로 공유되는 값을 바꾼 것
	Car.prototype.newParam = 30;
	alert("c1'''의 값 : " + c1.newParam); // 위에서 c1.newParam으로 생성했음으로 자기 newParam을 사용해 20이 나옴
	alert("c2의 값 : " + c2.newParam); // 30

</script>

저작자표시 비영리