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

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>

저작자표시 비영리

'스터디 > 자바스크립트' 카테고리의 다른 글

자바스크립트 객체의 캡슐화 (0)	2017.08.14
eclipse(이클립스) 자바스크립트(javascript) 자동완성 플러그인 설정하기 (0)	2017.08.11
자바스크립트 정리1 (0)	2017.08.09
자바스크립트 navigator를 이용한 IE 버전 알아내기 (0)	2017.08.08
자바스크립트로 부모,자식 요소 접근하기 (0)	2017.08.08

악덕고용주의 개발 일기

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

'스터디 > 자바스크립트' 카테고리의 다른 글

+ Recent posts

티스토리툴바