1. Global 오브젝트 개요, Global 함수, 변수
Global 오브젝트 개요
•
모든 <script>를 통해 하나만 존재합니다.
◦
new 연산자로 인스턴스 생성 불가
◦
모든 코드에서 공유
...
<script src="js/sc1.js"> </script>
<script src="js/sc2.js"> </script>
<script src="js/sc3.js"> </script>
...
HTML
복사
⇒ 3개의 script요소가 있어도 Global은 하나만 존재합니다.
•
이름(Global)은 있지만 오브젝트의 실체가 없고 오브젝트를 작성(사용)할 수 없습니다.
Global 오브젝트의 함수, 변수
•
Global 오브젝트의 함수와 변수를 Global 함수, Global 변수라 부르는데, 함수 안에 작성한 것을 지역 함수, 로컬(Local)함수라고 부르고, 지역 변수, 로컬 변수라고 불브니다. 또 Global 오브젝트를 전역 객체라 부르기도 하지만, Global은 오브젝트의 이름입니다.
2. Global 프로퍼티, 프로퍼티 리스트
프로퍼티 리스트
•
값
◦
NaN: Not-a-Number
◦
Infinity: 무한대 값
◦
undefined: undefined
•
함수
◦
isNaN(): NaN여부. NaN이면 true, 아니면 false반환
◦
isFinite(): 유한대여부, 유한이면true, 아니면 false
◦
parseInt(): 정수로 변환하여 반환
◦
parseFloat(): 실수로 변환하여 반환
◦
eval(): 문자열을 JS코드로 간주하여 실행
◦
encodeURI(): URI인코딩
◦
encodeURIComponent(): URI확장 인코딩
◦
decodeURI(): encodeURI함수의 인코딩 값을 디코딩
◦
decodeURIComponent(): encodeURIComponent함수의 인코딩 값을 디코딩
Global 프로퍼티
•
종류
◦
NaN:Not-a-Number
◦
Infinity: 무한대
◦
undefined: undefined
•
상수 개념으로 사용하며 외부에서 프로퍼티 값 변경이 불가능합니다
•
delete연산자로도 삭제 할 수 없습니다.
console.log(NaN);//NaN
console.log(Infinity);//Infinity
console.log(undefined);//undefined
JavaScript
복사
3. Global 과 Window 관계
Global과 Window 오브젝트는 각각 오브젝트 주체 대상이 다릅니다. Global은 JS가 주체이고 Window는 window가 주체입니다.
이렇게 각각 주체는 다르지만 Global 오브젝트의 프로퍼티와 함수가 window 오브젝트에 설정됩니다. 그 연유는 기타 빌트인(Built-in)오브젝트의 경우 각각의 실체(String, Number, Object ...)에 프로퍼티와 함수가 저장되지만, Global은 실체가 없기에 저장할곳이 없고 그렇기에 window 오브젝트에 설정되는 것입니다.
Host 오브젝트 개념 활용
⇒ 브라우저 안에있는 오브젝트를 자바스크립트에서 마치 자신의 것처럼 사용하는 개념을 이용해 위와 같은 처리가 가능합니다.
4. 정수, 실수 변환
parseInt()
•
값을 정수로 변환하여 반환합니다.
•
값이 "123px"이면 123을 반환합니다.
•
0 또는 빈 문자열을 제외시킵니다.
•
진수를 적용하여 값을 변환합니다.
console.log(parseInt(123.56));//123
console.log(parseInt("123px"));//123
console.log(parseInt("-123.45"));//-123
console.log(parseInt("12AB34"));//12 --- (1)
console.log(parseInt("0012"));//12
console.log(parseInt(" 123"));//123
console.log(parseInt());//NaN --- (2)
console.log(parseInt(13, 16));//19 --- (3)
console.log(parseInt("0x13"));//19
JavaScript
복사
⇒ (1): 문자를 만나는 순간 로직수행중단후 반환하기에 뒤 34는 반환되지 않습니다.
⇒ (2): 값을 작성하지 않으면 NaN인데 undefined가 아닌 이유는 기준이 Number이기 때문입니다.
⇒ (3): 13이라는 값을 16진수로 변경하여 19가 나옵니다.
parseFloat()
•
값을 실수로 변환하여 반환합니다.
◦
JS는 기본적으로 실수로 처리하기에 실수로 변환하는 것은 의미가 없지만 문자열의 실수 변환은 유의미합니다.
•
지수, 공백 변환
console.log(parseFloat("-123.45")+6);//-117.45
console.log(parseFloat("12.34AB56"));//12.34
console.log(parseFloat("1.2e3"));//1200
console.log(parseFloat(" 12.34 ")+20);//32.34
console.log(parseFloat());//NaN
JavaScript
복사
5. NaN, 유한대 체크 함수
isNaN()
•
값의 NaN여부를 반환합니다.
•
숫자 값이 아니면 true를 반환합니다.
•
숫자 값이면 false를 반환하는데, 값이 숫자로 변환되면 숫자로 인식합니다.
•
NaN === NaN 결과는 false입니다.
◦
설계 실수
◦
ES6의 Object.is() 사용
console.log(isNaN(NaN));//true
console.log(isNaN(undefined));//true
console.log(isNaN("123"));//false
console.log(isNaN("123A"));//true
console.log(NaN === NaN);//false
console.log(Object.is(NaN, NaN));//true
JavaScript
복사
isFinite()
•
값이 Infinity, NaN이면 false를 반환합니다. 그게아닌 유한대일 경우 true를 반환합니다.
•
값이 숫자로 변환되면 숫자로 인식합니다.
//NaN
console.log(isFinite(0 / 0));//false
// Infinity
console.log(isFinite(1 / 0));//false
console.log(isFinite("ABC"));//false
JavaScript
복사
6. 인코딩, 디코딩
encodeURI()
•
URI를 인코딩(Encoding)하여 반환합니다.
◦
Uniform Resource Identifier
◦
인코딩 제외 문자를 제외하고 "%16진수%16진수"형태로 변환합니다.
•
인코딩 제외 문자
◦
영문자, 숫자
◦
# ; / ? : @ & + $ , - _ . ! ~ * ( ) 따옴표
var uri = "data?a=번&b=호";
console.log(encodeURI(uri));//data?a=%EB%B2%88&b=%ED%98%B8
JavaScript
복사
encodeURIComponent()
•
URI를 인코딩하여 반환
◦
; / ? : @ & = + $ , 를 인코딩하는것이 encodeURI()와 다릅니다.
◦
인코딩 제외 문자를 제외하고 "%16진수 16진수" 형태로 변환합니다.
•
인코딩 제외 문자
◦
영문자, 숫자
◦
# - _ . ! ~ * ( )
decodeURI()
•
인코딩을 디코딩(Decoding)하여 반환합니다.
•
파라미터에 encodeURI()로 인코딩한 문자열을 작성합니다.
var uri = "data?a=번&b=호";
uri = encodeURI(uri);
console.log(uri);//data?a=%EB%B2%88&b=%ED%98%B8
uri = decodeURI(uri);
console.log(uri);//data?a=번&b=호
JavaScript
복사
decodURIComponent()
•
인코딩을 디코딩하여 반환
•
파라미터에 encodeURIComponent()로 인코딩한 문자열을 작성합니다.
7. eval() 함수
eval()
•
파라미터의 문자열을 JS코드로 간주하여 실행합니다.
•
실행 결과를 반환 값으로 사용합니다. 만일 값을 반환하지 않으면 undefined를 반환합니다.
var result = eval("parseInt('-123.45'));//-123
JavaScript
복사
eval() 함수는 사용을 권장하지 않습니다.
•
문장을 함수로 계산하여 평가를 한다는것은 임의의 사용자에 의해 영향을 받을 수 있다는 의미가 되고 이는 보안에 취약하게 됩니다.