본문 바로가기

javascript10

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.
자바스크립트 RSA 암호화 라이브러리 JSEncrypt JSEncrypt는 브라우저에서 서버로 보낼 데이터를 암호화 하기 위해서 사용할 수 있는 자바스크립트 라이브러리로 RSA 방식으로 데이터를 암호화/복호화 할 수 있습니다. RSA는 비대칭형 암호화 알고리즘으로 브라우저에서 공개키로 암호화 해서 데이터를 서버로 보내면 서버에서는 개인키로 복호화 할 수 있습니다. JSEncrypt는 http://travistidwell.com/jsencrypt/ 에서 다운로드 할 수 있습니다. 이 사이트에 설명되어 있듯이 JSEncrypt는 http://www-cs-students.stanford.edu/~tjw/jsbn/ 에 있는 다양한 암호화 관련 라이브러리들의 래퍼로 하나의 파일에 필요한 라이브러리를 모두 포함하고 있고, 간편한 API를 제공합니다. 다운로드 받은 파일.. 2018. 10. 4.
새창을 여는 window.open() 함수 사용법 웹브라우저에서 새창을 열기 위해서 가장 간단히 사용할 수 있는 방법이 자바스크립트 window 객체의 open() 함수를 사용하는 것입니다. 1. 문법(Syntax) var ret = window.open(url, name, specs, replace); 1.1. 반환값(ret) 새로 만들어진 창 객체가 반환됩니다. 창의 생성에 실패하면 null을 반환합니다. 이 객체를 통해서 새창을 제어할 수 있습니다. 예로 ret.close(); 로 창을 닫을 수 있습니다. 1.2. url 새창에 보여질 주소 입니다. 선택적인 값으로 비워두면 빈창(about:blank)이 보입니다. 1.3. name 새로 열릴 참의 속성 또는 창의 이름을 지정합니다. 선택적인 값으로 기본값은 "_blank" 입니다. 사용 가능한 값.. 2018. 6. 27.
자바스크립트의 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 Closure) 사용법 자바스크립트에서 클로저라는 것을 잘 이해하기 위해서는 프로그래밍 언어에서 사용되는 몇가지 개념들을 먼저 알아두면 좋을 것 같습니다. 그것들은 일급 객체(first-class object)또는 일급 함수(first-class function), 변수 범위, 중첩 함수 와 같은 것들 입니다. 1. 일급 객체 또는 일급 함수 일급 객체(first-class object)에 대한 정의를 위키피디아에서 찾아 보았습니다. 원문 : https://en.wikipedia.org/wiki/First-class_citizen "프로그래밍 언어를 디자인 할때 주어진 프로그래밍언어에서 일급 시민(또는 일급 타입, 일급 객체, 일급 엔티티, 일급 값)은 다른 엔티티들이 일반적으로 이용 가능한 모든 연산을 지원하는 엔티티를 뜻합.. 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.
반응형