[자바스크립트 완벽 가이드] 1. JS 원시타입 객체타입

김정환·2020년 11월 23일
0

자바스크립트 완벽 가이트 6판은 ECAMScript5와 HTML5를 기준으로 다루고 있음.
틀린 점 부족한 점 등등 지적해주시면 감사드리겠습니다 ㅜㅜ

HTML : 웹 페이지 내용
CSS : 웹 페이지 디자인
JavaScript : 웹페이지의 동적인 측면


JavaScript

  • 동적, 타입 명시가 필요없음
  • 번역과 동시에 프로그램을 한줄씩 동작시키는 인터프리터 언어
  • 함수의 인자나 반환값에 또 다른 함수를 사용할 수 있는 First-class 함수
  • 다른 객체(Object)의 프로퍼티를 상속하는 프로토타입 기반 상속

어휘구조

  • 문자는 Unicode를 사용하며 ASCII 문자열 시퀀스 정의
  • 대소문자 구분함
  • 토큰 사이 공백들 무시함

  • 리터럴(literal) : 프로그램에 직접 나타나는 데이터 값
  • 식별자(identify) : 다음과 같이 가능하지만 일반적으로 ASCII 문자랑 숫자만 사용
    - 시작글자: 알파벳 _ $
    - 이후글자: 알파벳 _ $ 숫자
  • 예약어 : 언어 내부적으로 사용할 용도로 미리 예약되어 있는 단어, 식별자로 사용 불가

  • return, break, continue와 다음 키워드 사이에 줄바꿈 X
  • 후치연산자는 반드시 연산자와 동일한 줄에 작성

타입, 값

원시 타입 : 숫자 문자열 boolean null undefined (변경 불가능한 값)

var a = "qwe";
a.toUpperCase();	// => "QWE"
a			// => "qwe"

객체(Object) 타입 : 나머지

var a = { q: "q" }
a.q = "Q";
a.y = "y";			
a 			// => { q: "Q", y: "y" }

숫자

  • 정수값 실수값 구분하지 않음
  • 이진표기법을 사용
0xff		// => 255 	16진수
0377		// => 255 	8진수 사용 X!
1/0		// => Infinity 	표현 가능한 가장 큰수보다 더 큼 (overflow)
-1/0		// => -Infinity	표현 가능한 가장 작은수보다 더 작음 (underflow)
0/0		// => NaN 	숫자가 아닌 값, ECMAScript5 에서는 읽기 전용 값
-0		// => -0

0 == -0			// => true
Infinity == -Infinity	// => false
0.3-0.2 == 0.2-0.1	// => false 이진표기법의 특징 . . .

문자열

  • 변경이 불가능한 값
  • 유니코드 문자로 표현
  • " " 또는 ' ' 로 표현
'msg="Hello"'	// => "msg="Hello""
"msg=\"Hello\""	// => "msg="Hello"" 구분하여 해석하기 위해 escape 사용

'msg=\'Hello\''	// => "msg='Hello'" 구분하여 해석하기 위해 escape 사용
"msg='Hello'"	// => "msg='Hello'"
  • 문자열 메서드
var s = "qwert "
s.length	// => 6
s[0]		// => "q"
s[s.length-1]	// => " " 
s.charAt(0)		// => "q"		
s.charAt(s.length-1)	// => " "
s.substring(2,4)	// => "er"		
s.substring(4,2)	// => "er"
s.slice(2,4)		// => "er"		
s.slice(-4,-2)		// => "er"
s.indexOf("e")		// => 2
s.split("e")		// => ["qw", "rt "]
s.replace(" ", "y")	// => "qwerty"
s.replace(" ", "y").toUpperCase()	// => "QWERTY"

substr, substring, slice 차이점

  • 정규표현식 RegExp() : 문자 패턴을 나타내는 객체를 생성함

boolean

: true or false

  • false 로 변환되는 값 : false 0 -0 undefined null NaN ""

null

: 값이 없음, 자료형에 속한 상태

undefined

: 값이 없음, 존재하지 않는 객체 프로퍼티나 배열 원소값 또는 초기화 되지않은 변수에 접근


객체, 배열

: 중괄호 {}로 둘러쌓인 name-value 쌍

  • 초기화 표현식: {} 내에 객체의 프로퍼티 이름 + 값을 묶어둔 객체의 표현 방법
  • 선언
var student = {		// 객체 student
    name: "JungHwan",	// 프로퍼티 "name"의 값	"JungHwan"
    age: 26		// 프로퍼티 "age"의 값	26
};
var arr = [0,1,2];	// 배열 arr
  • 접근
student.name		// => "JungHwan"
student["age"]		// => 26
arr[0]			// => 0

student.grade = 3;	// 값 할당, 프로퍼티 생성
arr[3] = 5;		// 배열 원소 추가

전역 객체 (Global)

: 인터프리터가 시작할 때, 자바스크립트 프로그램 전역에서 사용할 수 있게 정의되는 객체

  • 전역 프로퍼티 undefined Infinity NaN
  • 전역 함수 isNaN eval
  • 생성자 함수 Date() String() Object Array()
  • 전역 객체 등

래퍼 객체 (Wrapper)

: 문자열, 숫자 등의 프로퍼티에 접근하려 할 때 생성되는 임시 객체 등이 래퍼객체

var s = "qwert"
s.len = 4;	// => 4 
var t = s.len;	// => undefined 

원시 값의 프로퍼티 및 메소드를 활용하고 참조가 해제되면 메모리의 임시 객체가 삭제됨

변수

  • 유효범위: 정의된 변수가 사용 가능한 범위
var g 		// => undefined 전역변수 선언, 초기화하지 않을 시 undefined
g = "g";	// 초기화
function f() {
    console.log(g);	// => "g"
    var l = "l";	// 지역변수 선언 초기화
    console.log(l);	// => "l"
}
  • 호이스팅: 함수 안에 필요한 변수값들을 모두 모아서 유효 범위의 최상단에 선언
var g = "g";		// => 전역변수 선언
function f() {
    console.log(g);	// => undefined 변수, 선언만 하고 초기화되지 않았으므로 undefined
    var g = "l";	// 지역변수 초기화, 호이스팅으로 변수 선언은 함수 최상단으로
    console.log(g);	// => "l"
}

0개의 댓글