본문 바로가기

자바스크립트8

JavaScript - 흐름 제어와 오류처리 순차적으로 실행되는 명령을 조건에 따라 다른 명령을 실행할 수 있도록 해주는 흐름 제어(Flow Control)를 하는 방법을 알아봅니다. 1. 블록문 가장 기본적인 명령문은 세미콜론(;)으로 구분됩니다. 이러한 명령을 그룹으로 묶는 방법이 대괄호({}) 블록을 사용하는 것입니다. 블록은 함수, 조건문, 반복문, 에러처리 등에서 명령어 그룹을 묶는데 사용되어지며 변수의 유효범위를 결정하는 단위이기도 합니다. { 문장1; 문장2; . . . 문장n; } ※참고 var를 사용하면 함수 레벨 유효범위가 되고, ES6에서 추가된 let, const를 사용하면 블록 레벨 유효범위가 적용됩니다. 2. 조건문 조건에 따라 프로그램 실행 흐름를 변경할 수 있는 기능을 제공하는 명령으로 if, switch가 있습니다. .. 2022. 4. 4.
JavaScript - 데이터형, 형변환, 리터럴 1. 데이터 형(Data Type) 자바스크립트의 데이터형(Data Type)은 원시형(Premetive Type) 여섯가지와 객체형(Object Type) 한가지로 총 일곱가지가 있습니다. 1.1. 원시형(Premitive Type) - Boolean : true와 false 값을 가집니다. - null : 어떤 값이 의도적으로 비어있음을 의미하는 특별한 키워드 null을 사용합니다. 대소문자를 구별하므로 Null, NULL등은 null이 아닙니다. - undefined : 선언한 후 값을 할당하지 않은 변수 또는 값이 주어지지 않은 인수에 자동으로 할당됩니다. - Number : 정수 또는 실수형 숫자입니다. - String : 문자열 입니다. - Symbol : ES6에서 추가된 자료로 값이 고유하.. 2022. 4. 3.
JavaScript - 전역변수, 지역변수, 변수범위, 변수 호이스팅(Hoisting) 1. 전역변수와 지역변수 "전역변수"는 자바스크립트 코드내의 어느곳에서나 접근할 수 있는 변수를 말합니다. 전역변수를 만드는 방법은 다음과 같습니다. - 선언하지 않고 직접사용 합니다. - var로 선언시 함수 밖에서 선언 합니다. - let으로 선언시 블럭 밖에서 선언합니다. ※ 참조 전역변수는 실제로 전역 객체(global object)의 프로퍼티(Property)입니다. 전역객체는 자바스크립트를 웹브라우저에서 실행한다면 window 가 되고, Node.js에서 실행한다면 global이 됩니다. // 함수 밖에서 선언된 전역 변수는 실제로 window객체의 property입니다. name = "홍길동"; console.log(window.name); // "홍길동" 출력 "지역변수"는 정의된 블럭내에.. 2022. 4. 2.
JavaScript - 문장, 식별자, 변수선언 1. 문장(Statement) 자바스크립트 문장의 끝에는 세미콜론(;)이 있어도 되고 없어도 됩니다. 하지만 한줄에 여러 문장을 적으려면 세미콜론(;)으로 구분을 해줘야 합니다. 자바스크립트는 대소문자를 구별하며 유니코드를 사용합니다. 그러므로 변수명등 식별자에 "한글"을 사용할 수 있습니다. var 좋아하는과일 = "배"; // 변수에 공백은 사용할 수 없습니다. 2. 주석 프로그램에 설명을 달 수 있습니다. // 한줄 주석 입니다. 슬래쉬 2개 이후 부터 줄 끌까지 입니다. /* 이건 여러줄 주석입니다. slash-star부터 다음 start-slash가 나올때까지가 주석입니다. */ 3. 식별자(Identifier) 변수명, 함수명, 클래스명등 식별자는 시작하는 글자가 영문자, 유니코드가 가능하며,.. 2022. 4. 1.
자바스크립트 주기적인 실행(setInterval, setTimeout) 자바스크립트로 주기적인 작업을 실행하기 위해서 setInterval과 setTimeout 메소드를 사용할 수 있습니다. 두 가지는 비숫하지만 중요한 차이점을 가집니다. - setInterval 함수 : 일정한 시간 간격으로 작업을 수행하기 위해서 사용합니다.clearInterval 함수를 사용하여 중지할 수 있습니다. 주의할 점은 일정한 시간 간격으로 실행되는 작업이 그 시간 간격보다 오래걸릴 경우 문제가 발생할 수 있습니다. - setTimeout 함수 : 일정한 시간 후에 작업을 한번 실행합니다. 보통 재귀적 호출을 사용하여 작업을 반복합니다. 기본적으로 setInterval 과는 달리 지정된 시간을 기다린후 작업을 수행하고, 다시 일정한 시간을 기다린후 작업을 수행하는 방식입니다. 지정된 시간 사이.. 2018. 4. 20.
자바스크립트의 trim() 함수 사용하기 문자열 좌우에서 공백을 제거하는 함수가 trim() 함수 입니다. 대부분의 언어에서 기본 제공하고 있고, 좌/우 측만 trim 하는 함수를 제공하기도 합니다. 자바스크립트에서도 사용할 일이 자주 있는 편인데, IE8 이하에서는 제공되지 않습니다. 사이트가 IE 8 도 지원해야 한다면 보통 많이 사용하는 방법이 IE 조건부 주석을 사용해서 IE 8이하일때 String 객체의 prototype 에 trim() 함수를 추가하여 IE 8이하에서도 IE 9이상과 동일하게 사용할 수 있도록 지원하는 것입니다. 다른 방법은 jQuery를 사용한다면 jQuery의 $.trim(); 메소드를 사용하여 처리하는 방법입니다. 다음은 각각의 방법을 적용해본 예제입니다. TRIM 결과) :test: :test: :test : .. 2018. 4. 17.
자바스크립트 함수(Function)와 함수의 call(), apply(), bind() 함수 자바스크립트의 함수(Function)는 실제로는 전역객체의 함수 입니다. 전역객체는 웹브라우저일 경우 window이고, Node.js일 경우 global이 됩니다. 다음과 같이 일반적인 전역 함수를 정의하고 실행할 수 있습니다. function add(a, b) { return a + b; } console.log( add(3, 5) ); 결과) 8 이 add() 함수는 다음과 같이 호출할 수 있습니다. window.add(3, 5); 결과) 8 결과는 동일합니다. 실제로 두 함수는 동일한 함수 입니다. ※ 자바스크립트 함수는 그 자체로 객체입니다. 자바스크립트는 동적언어라 객체에 나중에 속성을 추가하는 것이 가능합니다. function bar() { console.log( "bar..." ); } ba.. 2018. 4. 10.
자바스크립트 배열(javascript array) 사용법 배열은 인덱스를 가지는 복수의 자료를 저장할 수 있는 자료구조 입니다. 데이터는 순차적으로 저장되며 중복이 가능합니다. 저장된 데이터에는 인덱스를 이용하여 접근이 가능합니다. 자바스크립트에서 배열의 사용법을 알아보겠습니다. 1. 배열 생성하기 배열을 생성하는데는 예전 방식인 new 명령을 사용하는 방법과 리터럴 표기법(literal notation) 을 사용하여 생성하는 방식이 있습니다. // 길이가 0인 예전 방식의 배열 생성 var myArray1 = new Array(); // 길이가 10인 예전 방식의 배열 생성 // 10개의 자리에는 아무것도 들어 있지 않습니다. var myArray2 = new Array(10); // 길이가 0인 literal notation 방식의 배열 생성 var myA.. 2018. 4. 10.