어제 오늘 내일

Javascript에서 특정 인덱스 위치의 문자를 찾아 읽어오는 2가지 방법을 소개합니다. chartAt() 함수 활용 하기 str.charAt(index) charAt 함수는 주어진 문자열의 index 위치의 문자를 읽어서 리턴합니다. index는 0부터 시작합니다. index 값이 입력되지 않으면, index 값은 자동으로 0으로 지정됩니다. charAt() 함수 활용 예제 See the Pen 문자열 by anna (@hianna) on CodePen. 예제1 파라미터로 index가 지정되지 않으면, index 값은 자동으로 0으로 설정됩니다. 문자열의 0번째 index에 위치한 글자 'a'를 리턴하였습니다. 즉, 파라미터를 입력하지 않으면, 문자열의 첫번째 글자를 리턴합니다. 예제2 파라미터로 0..

문자열을 일정한 구분자로 잘라서 각각의 문자열을 배열로 저장하는 방법을 알아보도록 하겠습니다. 문자열을 일정한 구분자로 잘라서 배열로 저장하기 위해서는 split() 함수를 사용합니다. split() 함수 string.split(separator, limit) split() 함수는, 문자열을 'separator'로 잘라서, 'limit' 크기 이하의 배열에 잘라진 문자열을 저장하여 리턴합니다. separator 필수 아님 문자열을 잘라 줄 구분자 (문자열 또는 정규식) 값이 입력되지 않으면 문자열 전체를 배열에 담아서 리턴합니다. limit 필수 아님 최대 분할 갯수 예제 1. 파라미터를 입력하지 않을 경우 See the Pen 문자열 by anna (@hianna) on CodePen. 파라미터로 아무..

동등 연산자('==', '===') 비교 Javascript에서 문자열의 비교를 위해서는 동등연산자('==' 또는 '===')를 사용합니다. 동등 연사자를 사용하여 두 개의 문자열을 비교해서 두 문자열이 같으면 'true'를 리턴하고, 다르면 'false'를 리턴합니다. See the Pen 문자열 by anna (@hianna) on CodePen. '==' 연산자와 '==='의 차이는 다음 링크를 참조하세요. [Javascript] '==' 연산자와 '===' 연산자의 차이점 [Javascript] '=='와 '==='의 차이 (null, undefined) 비교 연산자('') 비교하기 ( 대소비교) '' 연산자를 사용하여 문자열의 순서를 비교할 수도 있습니다. '' 연산자는 문자열을 '사전 순서' ..

지난번에는 '==' 연산자와 '===' 연산자의 기본적인 차이점에 대해서 알아보았습니다. [Javascript] '==' 연산자와 '===' 연산자의 차이점 이번에는 '=='와 '===' 연산자를 이용해서 null, undefined 값을 체크했을 경우 어떤 결과가 나오는지 알아보겠습니다. '=='연산자와 '==='를 이용한 unll, undefined 비교 See the Pen 문자열 by anna (@hianna) on CodePen. 따라서, 위의 예제를 보면 '==' 연산자를 이용하여 두 값(null과 undefined)을 비교하면 true를 리턴합니다. 그러나, '===' 연산자를 이용하여 두 값을 비교하면 타입이 다르기 때문에 false를 리턴합니다. '==' 연산자를 이용한 null, und..

'=='와 '==='의 차이 '=='는 비교하는 두 개의 값(피연산자)을 강제로 같은 형으로 변환한 후, 비교를 수행합니다. 즉, 두 값의 타입이 다르더라도, 형 변환된 값이 같다면 true를 리턴합니다. '==='는 비교하는 두 개의 값(피연산자)의 타입과 값이 모두 같을 경우에만, true를 리턴합니다. See the Pen 문자열 by anna (@hianna) on CodePen. 위 첫번째 예제에서 숫자 1과 문자열 '1'을 비교하였습니다. '==' 연산자를 사용하여 비교하면, 두 피연산자의 타입이 달라도 true를 리턴하는 것을 확인할 수 있습니다. 그렇지만, '===' 연산자를 사용하여 비교하면, 둘 다 1이지만, 타입이 다르기 때문에 false를 리턴합니다. 두 번째 예제에서는 boolea..

이번에 알아볼 반복문은 for...of 입니다. for...of 는 ES6에 추가된 문법입니다. 이 반복문은 배열 또는 map객체 등 iterable 객체의 값들을 순회할 수 있습니다. for...of for(variable of object){ statement } object 는 iterable 객체입니다. (배열 또는 Map, Set, String 등) variable은 iterable 객체에서 하나씩 뽑아온 값입니다. for...of를 사용하면 배열의 인덱스는 알 수 없습니다. 인덱스를 알아야 한다면 다른 for 반복문을 사용해야 합니다. [Javascript] 반복문(1) - for 예제 1. 배열 See the Pen 반복문 by anna (@hianna) on CodePen. 예제 2. 문자..

Javascript 객체의 모든 key와 value를 가져오는 방법을 알아보도록 하겠습니다. 객체의 모든 프로퍼티를 순회하기 위해서는 for...in 반복문을 사용합니다. 기본 문법 for (variable in object) { // 코드블럭 } variable : object에서 순차적으로 하나씩 꺼내온 property(속성)의 key(이름) object : 탐색할 object 사용 예시를 살펴볼까요? See the Pen 반복문 by anna (@hianna) on CodePen. 코드를 자세히 살펴볼까요? const person = { name : 'Anna', age : 20, id : 'hianna' }; for(prop in person) { document.write(prop + " : "..

이번에 알아볼 반복문은 do..while입니다. while 문과 비슷하지만, 첫번째 반복문을 실행 할때 실행 순서가 조금 다릅니다. do...while do { // 반복할 코드 } while (조건문); do...while문은 조건문을 판단하기 전에 do 블록의 코드를 먼저 실행합니다. 그리고, 조건문을 판단하여, 조건문의 결과가 true이면 do 블록의 코드를 다시 실행합니다. 이 과정을 반복합니다. 예제 1 See the Pen 반복문 by anna (@hianna) on CodePen. 예제 2 - while문과 do...while의 차이점 See the Pen 반복문 by anna (@hianna) on CodePen. while문과의 차이점은 다음과 같습니다. while문은 처음 while문을..

지난번에는 for문의 기본적인 사용방법을 알아보고, 별찍기 예제도 만들어 보았습니다. [Javascript] 반복문(1) - for [Javascript] for문을 이용해서 별찍기 이번에는 for문을 응용하여 구구단을 찍는 예제입니다. 구구단 찍기 for(let i = 2; i

지난번에는 for문의 기본적인 사용방법을 알아보았습니다. [Javascript] 반복문(1) - for 이번에는 for문을 응용한 다양한 형태의 별찍기 예제를 공유합니다. 정사각형 별찍기 See the Pen 반복문 by anna (@hianna) on CodePen. 삼각형 별찍기 See the Pen 반복문 by anna (@hianna) on CodePen. See the Pen 반복문 by anna (@hianna) on CodePen. 거꾸로 삼각형 별찍기 See the Pen 반복문 by anna (@hianna) on CodePen. See the Pen 반복문 by anna (@hianna) on CodePen. 정삼각형 별찍기 See the Pen 반복문 by anna (@hianna) ..