IT Log

JavaScript (2) 본문

JavaScript

JavaScript (2)

newly0513 2020. 6. 5. 09:30
728x90
반응형

Data Type

값을 포함한 Data Type

  • String(문자열)
  • Number(숫자)
  • Boolean(참or거짓)
  • Funtion(함수)
  • Object(객체)
    • Obejct
    • Date
    • Array
    • String
    • Number
    • Boolean

값을 포함하지 않은 Data Type

  • Null
  • Undefined

String(문자열)

  • ''(작은 따옴표)나 ""(큰 따옴표)로 선언
var double = "Double Quotes";
var single = 'Single Quotes';

Nubmer(숫자)

  • 소수로 표현하거나 소수 없이 표현
var num = 29;
var number = 29.00;

Boolean

  • true 또는 false 값만 가짐
var x = 29, y = 29, z = 30;
(x == y) // true
(x == z) // false

Function

  • 특정 작업을 수행하도록 설계된 코드 블록
  • function, name, ()로 정의
  • name은 문자, 숫자, _, $를 포함할 수 있음
  • ()안에는 쉼표로 구분된 매개 변수 이름이 포함될 수 있음
  • 함수가 실행할 코드는 {}안에 작성
  • 변수 값으로 사용 가능
function name(parameter1, parameter2, ...) {
  // 실행할 코드
}

 

호출

  • Event가 발생할 때
  • JavaScript 코드에서 호출될 때
  • 자체 호출

 

반환

  • return 명령문에 도달하면 함수 실행이 중지
  • 종종 반환 값을 계산
  • ()없이 호출하면 함수 객체를 반환
function number(x, y) {
  return x + y;             
}

var result = number(1, 2);  
// result의 값은 3

nubmer
// function number(x, y) {  return x + y;  }

Object(객체)

  • 객체에는 많은 값이 포함
  • name : value로 작성
  • 속성(property) 또는 방법(method)이라는 명명된 값의 컨테이너
  • 객체의 속성 : 일반적으로 객체의 메소드에서 내부적으로 사용되는 변수
  • 객체의 방법 : 객체가 무언가를 하거나 무언가를 하도록하는 기능
  • 문자열, 숫자 및 Boolean을 객체로 선언하지 말 것 (코드가 복잡해지고, 실행 속도 저하)
var person = {
  firstName: "John",			// 속성
  lastName : "Doe",			// 속성
  id       : 5566,			// 속성
  fullName : function() {		//메소드
    return this.firstName + " " + this.lastName;
  }
};

Date

  • 날짜는 'new Date()'로 선언
  • 날짜를 생성하는 방법은 4가지
new Date( )							// 현재 날짜와 시간
new Date(milliseconds)						// 밀리초로 저장
new Date(datestring)						// 날짜 문자열
new Date(year,month,date[,hour,minute,second,millisecond ])	// 지정된 날짜 및 시간

 

예시

<script type = "text/javascript">
  var dateobject = new Date(1993, 6, 28, 14, 39, 7);
  //var dateobject = new Date();
  //var dateobject = new Date(1000);
  //var dateobject = new Date("October 13, 2014 11:13:00");
  stringobj = dateobject.toString();
  document.write( "String Object : " + stringobj ); 
</script>

 

Date Property

속성 설명
constructor 객체를 생성한 배열 함수에 대한 참조를 반환
prototype 프로토 타입 속성을 사용하면 속성과 메서드를 개체에 추가

 

Date Method

메소드 설명
Date() 오늘 날짜와 시간을 반환
getDate() 지정된 날짜의 날짜를 반환
getDay() 지정된 날짜의 요일을 반환
getFullYear() 지정된 날짜의 연도를 반환
getHours() 지정된 날짜의 시간을 반환
getMillliseconds() 지정된 날짜의 밀리 초를 반환
getMinutes() 지정된 날짜의 분을 반환
getMonth() 지정된 날짜의 월을 반환
getSeconds() 지정된 날짜의 초를 반환
getTime() 1970년 1월 1일 00:00:00 UTC 이후 지정된 날짜의 숫자 값을 밀리초 단위로 반환
getTimezoneOffset() 표준 시간대 오프셋을 분 단위로 반환
setDate() 지정된 날짜의 날짜를 설정
setFullYear() 지정된 날짜의 전체 연도를 설정
setHours() 지정된 날짜의 시간을 설정
setMillliseconds() 지정된 날짜의 밀리 초를 설정
setMinutes() 지정된 날짜의 분을 설정
setMonth() 지정된 날짜의 월을 설정
setSeconds() 지정된 날짜의 초를 설정
setTime() 1970년 1월 1일 00:00:00 UTC 이후의 밀리초로 나타내는 시간으로 설정
toDateString() Date의 "date" 부분을 문자열로 반환
toLocaleDateString() 현재 local의 규칙을 사용하여 Date의 "date" 부분을 문자열로 반환
toLocaleFormat() 형식 문자열을 사용하여 날짜를 문자열로 변환
toLocaleString() 현재 local의 규칙을 사용하여 날짜를 문자열로 변환
toLocaleTimeString() 현재 local의 규칙을 사용하여 Date의 "time" 부분을 문자열로 반환
toSource() 동등한 Date 객체의 소스를 나타내는 문자열을 반환
toString() 지정된 Date 객체를 나타내는 문자열을 반환
toTimeString() Date의 "time" 부분을 문자열로 반환
toUTCString() 표준시를 사용하여 날짜를 문자열로 반환
valueOf() Date 객체의 primitive값을 반환
   

 

날짜 정적 Method

메소드 설명
Date.parse() 날짜 및 시간의 문자열 표현을 구문 분석하고 해당 날짜의 내부 밀리초 표현을 반환
Date.UTC() 지정된 UTC 날짜 및 시간의 밀리 초 표시를 반환

Array

  • 단일 변수에 여러 값을 저장하는데 사용
  • 배열은 객체이며, 숫자나 이름을 사용하여 요소에 액세스
  • 배열 요소는 객체가 될 수 있음
  • 선언하는 방법 :  var array_name = [item1, item2, ...];
var floor = ["fisrt","second","third"];

var floor = [
  "fisrt",
  "second",
  "third"
];

var floor = new Array("fisrt","second","third");
// 모두 동일한 결과지만 가독성 및 실행속도를 위하여 배열 리터럴(위쪽 2가지)을 방법을 사용

 

Array Property

속성 설명
constructor 객체를 생성한 배열 함수에 대한 참조를 반환
index 문자열에서 0부터 시작하는 일치 인덱스를 나타냄
input 정규식 일치로 만든 배열에만 존재
length 배열의 요소 수를 반영
prototype 프로토 타입 속성을 사용하면 속성과 메서드를 개체에 추가

 

Array Method

메소드  설명
concat 이 배열로 구성된 새 배열을 다른 배열이나 값과 결합하여 반환
every 이 배열의 모든 요소가 제공된 테스트 기능을 만족하면 true 반환
filter 제공된 필터링 함수가 true를 반환하는 이 배열의 모든 요소를 사용하여 새 배열을 만듦
forEach 배열의 각 요소에 대한 함수를 호출
indexOf 지정된 값과 같은 배열 내 요소의 첫 번째 인덱스를 반환하거나 없는 경우 -1을 반환
join 배열의 모든 요소를 문자열로 결합
lastIndexOf 지정된 값과 같은 배열 내 요소의 마지막 인덱스를 반환하거나 없는경우 -1을 반환
map 이 배열의 모든 요소에 대해 제공된 함수를 호출한 결과로 새 배열을 만듦
pop 배열에서 마지막 요소를 제거하고 해당 요소를 반환
push 배열 끝에 하나 이상의 요소를 추가하고 배열의 새 길이를 반환
reduce 배열의 두값에 대해 함수를 동시에 적용하여 단일 값으로 줄임
reduceRight 배열의 두값(오른쪽에서 왼쪽)에 대해 함수를 동시에 적용하여 단일 값으로 줄임
reverse 배열 요소의 순서를 반대로 바꿈
shift 배열에서 첫 번째 요소를 제거하고 해당 요소를 반환
slice 배열의 섹션을 추출하여 새 배열을 반환
some 이 배열에서 하나 이상의 요소가 제공된 테스트 기능을 만족하면 true를 반환
toSource 객체의 소스 코드를 나타냄
sort 배열의 요소를 정렬
splice 배열에서 요소를 추가하거나 제거
toString 배열과 해당 요소를 나타내는 문자열을 반환
unshift 배열 앞에 하나 이상의 요소를 추가하고 배열의 새 길이를 반환

String, Number, Boolean (Object)

  • Stirng, Nubmer, Boolean은 객체로 생성하면 코드가 복잡해지고 실행속도가 저하됨
  • 선언 방법은 new String(), new Number(), new Boolean()

Null

  • null은 아직 값이 정해지지 않은 것

  • type은 object
var nl = "";
var nl = null;

Undefined

  • undefined는 초기화되지 않았거나 존재하지 않는 변수일 때 반환

  • 값으로 설정하여 변수를 비울 수 있음
  • type은 undefined
var und;
var und = undefined;

# null 과 비교
null == undefined	// true
null === undefined	// false

값은 같지만 type은 다르다.
728x90
반응형

'JavaScript' 카테고리의 다른 글

jQuery Tutorial (3)  (0) 2020.06.09
jQuery Tutorial (2)  (0) 2020.06.09
jQuery Tutorial (1)  (0) 2020.06.08
JavaScript (3)  (0) 2020.06.08
JavaScript (1)  (0) 2020.06.03
Comments