함께 성장하는 프로독학러

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 문자를 base64로 인코드, 디코드 하는 메소드인 btoa(), atob() 에 대해서 알아보도록 하겠습니다. base64 가 무엇인지 궁금하신 분은 아래의 위키백과 링크를 참조해 주세요.위키백과 - 베이스64 베이스64 는 간단히 말하자면 64진법 데이터입니다. Base64 인코딩은 텍스트 데이터를 처리하도록 설계된 미디어를 통해 전송되거나 저장되야 하는 바이너리 데이터를 인코딩 해야할 때 일반적으로 사용됩니다.Base64는 데이터가 전송중에 수정되지 않고 그대로 전송되는 것을 보장합니다.Base64는 일반적으로 MIME을 통한 전자 메일 또는 복잡한 데이터를 XML로 저장하는 등 여러 가지 응용 프로그램에서 사용됩니다. 자바스크립트에서 문자열을 ba..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 배열에 원소를 추가 및 제거하는 네 가지 메소드에 대해서 알아보도록 하겠습니다. 알아볼 메소드는 unshift(), push(), shift(), pop() 메소드 들 입니다. 이들의 역할을 그림을 통해서 직관적으로 알아보도록 하겠습니다. [ item1, item2, item3 ] 과 같은 배열이 있다고 생각해 봅시다.이 배열에서 원소를 맨 앞에 추가하거나, 맨뒤의 원소를 제거하려면 어떤 메소드를 사용하면 좋을까요? 위의 그림과 같이 맨 앞의 원소를 추가하는 메소드는 unshift 메소드이고, 맨 뒤에 원소를 추가하는 메소드는 push 메소드 입니다.원소를 제거하는 경우에는 제거 대상이 맨 앞의 원소일 경우 shift, 맨 뒤의 원소일 경우에는 pop 메..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 문자열의 split 메서드에 대해서 알아보도록 하겠습니다. 먼저 표현식부터 살펴보도록 하겠습니다. str.split([separator[, limit]])split 메소드는 문자열(dataType)에서 사용하는 메소드이며, 두 개의 선택적 파라메터를 가지고 있습니다.seperator 는 문자열을 구분하는데 사용하는 하나 이상의 문자를 나타내는 정규표현식(Regular Expression) 개체입니다.(seperator 가 생략되면 전체 문자열을 포함하는 length 가 1인 배열을 반환합니다.)limit 은 반환되는 배열의 길이를 제한하는 값입니다. 메서드의 리턴값은 seperator 를 기준으로 나눈 문자열의 배열입니다.(seperator 로 사용된 정..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 자바스크립트의 조건문 중 하나인 switch 문에 대해서 알아보도록 하겠습니다. switch 문의 표현식은 다음과 같습니다. switch (expression) { case value1: //Statements executed when the result of expression matches value1 [break;] case value2: //Statements executed when the result of expression matches value2 [break;] ... case valueN: //Statements executed when the result of expression matches valueN [break;] default..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 자바스크립트의 생성자 함수와 prototype 객체에 대해서 알아보도록 하겠습니다. 먼저 prototype 객체에 대해서 알아보겠습니다. 일단 이름부터가 무시무시합니다. 저도 처음에 프로토타입 객체니 생성자니 this니 constructor니... 하는 용어들에 압도된 적이 있었는데요, 천천히 알아가 보도록 합시다. 자바스크립트에는 여러가지 데이터 형태가 있습니다.Boolean, Number, String, Null, undefined, Object, Array, Function 등 여러가지의 데이터 타입이 있습니다.이 데이터 타입을 크게 기본 타입과 객체로 나누어 볼 수 있습니다. 기본 타입 : Number, String, Boolean, undefin..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 배열과 문자열에서 사용가능한 메서드인 slice 메서드에 대해서 알아보도록 하겠습니다. slice 메서드는 단어에서 의미를 유추해 볼 수 있듯이 배열이나 문자열의 원소를 잘라내 추출하는 것입니다.먼저 표현식부터 살펴보겠습니다. arr/str.slice([beginIndex][, endIndex])배열이나 문자열에서 사용하는 메서드이며 파라메터로는 beginIndex 와 endIndex 가 옵니다.beginIndex 는 말 그대로 슬라이스를 시작하는 인덱스 번호를 의미합니다.배열과 문자열 공통으로 0부터 시작하는 인덱스를 의미합니다.* beginIndex 값이 생략되면 0 부터 슬라이스 하겠다는 의미입니다.* beginIndex 값이 음수라면 배열이나 문자..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 배열의 원소를 삭제하거나 삭제하고 새로운 원소들을 추가하는 메서드인 splice 메서드에 대해서 알아보겠습니다. 표현식은 다음과 같습니다. array.splice(start) array.splice(start, deleteCount) array.splice(start, deleteCount, item1, item2, ...)splice의 메서드의 인자로 들어오는 값은 차례로 start, deleteCount, items 입니다. start는 삭제할 배열의 요소의 index 번호를 의미합니다.그리고 뒤에 나오는 deleteCount 인자는 start 부터 몇 개의 요소를 삭제할지 결정하는 숫자입니다.즉, start 인덱스부터 deleteCount 갯수만큼 ..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 배열의 filter 메서드에 대해서 알아보도록 하겠습니다.filter 메서드는 메서드의 이름과 같이 배열의 원소들 중 조건에 만족하는 원소들을 필터링 하는 메서드 입니다. 표현식부터 살펴보겠습니다. var new_array = arr.filter(callback[, thisArg])filter 메서드의 인자로는 콜백함수와 생략가능한 thisArg 값이 들어옵니다.콜백함수는 기존의 배열에서 필터링을 할 수 있도록 하는 함수입니다.이 함수의 인수는 element, index, array 입니다. 각각 배열의 원소, 해당 원소의 index값, filter 메서드를 행하는 대상 배열입니다.세 인수 중 index와 array는 생략이 가능합니다.filter 메서드..

안녕하세요, 프로독학러 입니다. 오늘은 배열과 문자열에서 사용 가능한, 검색을 위한 메서드인 indexOf 메서드에 대해서 알아보도록 하겠습니다. 먼저, 표현식부터 살펴 보겠습니다. arr/str.indexOf(searchElement/searchValue[, fromIndex])메서드의 첫 번째 인자로는 검색할 대상이 들어옵니다.(배열일 경우 검색할 엘리먼트, 문자열일 경우 검색할 문자)그리고 생략 가능한 두 번째 인자는 검색을 시작할 index입니다.만약 배열이라면 배열의 index값 (0 부터 시작해서 하나씩 증가)을 의미하며,문자열이라면 문자열 각각의 문자 하나하나를 의미합니다. (마찬가지로 첫 번째 글자부터 0, 1, 2, 3 ...) indexOf 메서드의 리턴값은 배열일 경우에 검색된 엘리먼..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 배열의 원소를 정렬하는 메서드인 sort 메서드에 대해서 알아보도록 하겠습니다. 표현식은 다음과 같습니다. arr.sort([compareFunction])sort메서드의 인자로는 배열의 원소를 비교하는 함수가 들어옵니다.만약 함수가 생략되면 각 문자의 유니코드 포인트 값에 따라 정렬됩니다.*유니코드 값에 대한 설명 - 네이버 지식백과 만약 함수가 생략되지 않는다면 compareFunction은 두 개의 인자를 받습니다.각각의 인자는 배열안의 비교대상인 a와 b입니다.그리고 sort 메서드의 정렬되는 기준은 compareFunction의 리턴값이 양수, 음수, 0 이냐에 따라 달라집니다. 이를 예제와 함께 알아보도록 하겠습니다. 12var arr = [2..