JavaScript/JavaScript 문법60 [JavaScript]동일한 문자열 반복해서 붙이기 JavaScript에서 동일한 문자열을 반복해서 붙여야 하는 경우 반복문을 사용하지 않고 처리할 수 있습니다. 문자열의 repeat 함수와 배열의 fill 함수를 응용하는 방법이 있습니다. 이번 포스팅은 repeat 함수와 fill 함수를 사용하여 동일한 문자열을 반복해서 붙이는 방법을 정리합니다. 목차 반복문 사용 repeat 함수 사용 fill 함수 사용 반복문 사용 지정된 횟수만큼 loop를 반복하여 동일한 문자열을 붙입니다. var str = 'ABC'; var count = 4; var resultString = ''; for(var loop = 0; loop < count; loop++) { resultString += str; } console.log(resultString); // ABCA.. JavaScript/JavaScript 문법 2021. 8. 19. [JavaScript]문자열 공백 제거 방법 JavaScript에서 문자열의 공백을 제거하는 방법은 다양합니다. 이번 포스팅에서는 replace, trim, split, join 함수를 활용하여 문자열의 공백을 제거하는 다양한 방법을 정리합니다. 목차 trim 함수를 사용하여 문자열 앞뒤 공백을 제거 정규식과 replace 함수를 사용 split 함수와 join 함수를 사용 trim 함수를 사용하여 문자열 앞뒤 공백을 제거 trim 함수를 사용하여 문자열 앞뒤 공백을 제거합니다. 문자열 내부의 공백은 제거 불가능합니다. var str = ' a b c '; var strTrim = str.trim(); console.log(str.length); // 8 console.log(strTrim); // a b c console.log(strTrim.l.. JavaScript/JavaScript 문법 2021. 8. 19. [JavaScript]객체에 프로퍼티가 존재하는지 체크하는 방법 JavaScript의 in 연산자는 프로퍼티가 객체에 존재하는지 체크하는 연산자입니다. 사용 방법은 심플합니다. 좌변의 피연산자는 존재유뮤를 체크할 프로퍼티 이름을 문자열(혹은 문자열로 변환이 가능한 값)로 받습니다. 우변의 피연산자는 객체 또는 배열이 올 수 있습니다. 프로퍼티명 in 객체명 프로퍼티가 객체에 존재하면 true를 반환하며, 존재하지 않을 경우 false를 반환합니다. 객체가 존재하지 않는 경우에는 에러가 발생합니다. 이번 포스팅에서는 in 연산자 사용 방법을 정리합니다. 목차 배열의 프로퍼티를 체크 객체의 프로퍼티를 체크 사용자가 정의한 객체의 프로퍼티를 체크 Html 요소에 프로퍼티가 존재하는지 체크 배열의 프로퍼티를 체크 var arr = ['A', 'B', 'C']; // 0을 문.. JavaScript/JavaScript 문법 2021. 8. 19. [JavaScript]문자열에서 특정 문자열 포함 여부 확인 JavaScript에서 문자열이 특정 문자열을 포함하는지 확인하는 방법에 대해 소개합니다. 방법이 다양하므로 로직에 적합한 함수를 사용하면 되겠습니다. ※ 함수의 성능은 브라우저마다 다릅니다. ECMAScript 6부터 지원하는 includes 함수 includes 함수는 ECMAScript 6부터 지원하므로 일부 환경에서는 실행이 안될 수 있습니다. 특정 문자열이 존재하면 true를 반환하며, 존재하지 않으면 false를 반환합니다. str.includes(searchString[, position]) searchString - 검색하고자 하는 문자열입니다. position - 검색 시작 위치이며, 생략할 경우 시작 위치는 0으로 설정됩니다. includes 함수는 대소문자를 구분합니다. var str.. JavaScript/JavaScript 문법 2021. 8. 17. [JavaScript]Map 객체 Map 객체는 ECMAScript 6부터 도입된 JavaScript 객체입니다. Map 객체는 [키, 값] 형태의 값을 가지는 객체입니다. 키는 Map 객체에서 고유해야 하며, 값은 변경 가능합니다. 이번 포스팅에서는 Map 객체의 사용 방법을 정리합니다. 목차 Map 객체 생성 방법 Object와 Map 비교 Map 객체 다루기(요소의 개수, 추가, 삭제) Map 객체의 요소를 반복문으로 접근하기 Map 객체 생성 방법 빈 Map 객체를 생성합니다. var mapObject = new Map(); [키, 값] 형태의 중첩 배열을 전달하여 Map 객체를 생성하는 방법입니다. var mapObject = new Map([ ['A', 'valueA'], ['B', 'valueB'], ['C', 'valueC.. JavaScript/JavaScript 문법 2021. 8. 17. [JavaScript]배열에서 특정 조건을 만족하는지 체크하는 some 함수 JavaScript에서 some 함수는 배열의 요소를 순차적으로 순회하면서 특정 조건을 만족하는지 체크합니다. 만족하는 요소가 하나라도 있을 경우 true를 그 외에는 false를 반환합니다. 목차 some 함수 구문 및 매개변수 some 함수의 특징 배열 요소에서 10보다 큰 값이 있는지 체크 callback 함수를 화살표 함수로 사용 some 함수 구문 및 매개변수 arr.some(callback(element, index, array), thisArg) arr - 순회하고자 하는 배열 element - 현재 배열의 요소 index(생략 가능) - 현재 배열 요소의 index array(생략 가능) - some 함수를 호출한 배열 thisArg(생략 가능) - callback 함수를 실행할 때, th.. JavaScript/JavaScript 문법 2021. 8. 17. [JavaScript]변수 선언과 호이스팅(Hoisting) JavaScript의 변수 선언 방법과 호이스팅(Hoisting) 개념에 대해 정리합니다. 변수 선언 방법과 호이스팅은 간단한 개념이지만, 이번 기회에 정확하게 정리하고자 합니다. 목차 변수 선언 방법 전역 변수와 함수 내부의 지역 번수 이름이 동일 호이스팅(Hoisting) 변수 선언 방법 JavaScript에서는 변수를 var 키워드를 이용하여 선언할 수 있습니다. (let과 const 키워드는 추후 정리할 예정입니다.) 변수마다 var 키워드를 사용하여 변수를 선언할 수 있습니다. var value; var name; 콤마( , )를 사용하여 한 줄로 선언할 수도 있습니다. var value, name; 그리고 변수 선언과 동시에 초기화를 할 수도 있습니다. var languane = 'Korean.. JavaScript/JavaScript 문법 2021. 8. 17. [JavaScript]현재 날짜 구하기, yyyymmddhhmmss포메팅 JavaScript에서 날짜와 시간을 나타내는 Date 객체 사용 방법을 정리합니다. 목차 Date 객체 생성하기 Date 객체에서 날짜 정보 가져오기 문자열 변환 함수 및 yyyymmddhhmmss 포메팅 몇 년, 몇 월, 며칠 전후 Date 객체 생성하기 매개변수가 없으면, 생성 시점의 날짜로 Date 객체를 생성합니다. // 현재 날짜 var nowDate = new Date(); console.log(nowDate); // Mon Aug 16 2021 18:17:28 GMT+0900 (한국 표준시) // 년, 월, 일을 전달한 값으로 셋팅 // 2021년 1월 1일의 Date객체 생성 var date1 = new Date(2021, 0, 1); console.log(date1); // Fri Ja.. JavaScript/JavaScript 문법 2021. 8. 16. [ECMAScript]Set 객체 Set 객체는 ECMAScript 6부터 도입된 JavaScript 객체입니다. Set 객체를 간단하게 설명하자면, 고유한 값을 가지는 객체입니다. 중복 값을 가지지 않고 정렬되지 않은 상태로 생성됩니다. 이번 포스팅에서는 Set 객체의 사용 방법을 정리합니다. 목차 Set 객체 생성 방법 Set 객체 다루기(요소의 개수, 추가, 삭제) Set 객체의 요소를 반복문으로 접근하기 부분집합, 합집합, 교집합, 차집합 Set 객체 생성 방법 빈 Set 객체를 생성합니다. var setObject = new Set(); iterableObject(순회할 수 있는 객체)를 전달하여 Set 객체를 생성하는 방법입니다. 중복되는 값을 가지는 배열을 전달하여 중복 값을 가지지 않은 Set 객체를 생성합니다. var s.. JavaScript/JavaScript 문법 2021. 8. 13. [JavaScript]객체의 프로퍼티를 접근하는 방법 JavaScript에서 객체의 프로퍼티을 접근하는 방법은 점( . ) 표기법과 대괄호( [] ) 표기법이 존재합니다. 이번 포스팅에서는 객체의 프로퍼티를 접근하는 방법과 표기법 사용 방법을 정리합니다. 목차 객체의 프로퍼티를 접근하는 방법 어떤 표기법을 사용하는 것이 좋은가? 점 표기법의 한계 동일한 이름의 식별자와 속성이 존재하는 경우 결론 객체의 프로퍼티를 접근하는 방법 점( . ) 표기법과 대괄호( [] ) 표기법을 사용하여 접근합니다. var objProperties = 'title' var obj = { title : 'Java' } // 점 표기법 console.log(obj.title); // Java // 대괄호 표기법 1. 문자열로 접근 console.log(obj['title']); /.. JavaScript/JavaScript 문법 2021. 8. 11. [JavaScript]콜백(Callback) 함수 JavaScript에서 콜백(Callback) 함수는 함수의 인수로서 다른 함수로 전달되는 함수입니다. 콜백 함수는 주로 배열에서 사용 가능한 foreach, map, filter, reduce 함수에서 사용됩니다. 대부분의 개발자들은 foreach문에 콜백 함수를 전달하고 있다는 것도 모른 채 foreach문을 사용하고 있을 수 있습니다. 물론, 저도 콜백 함수를 자세하게 몰라서 이번 기회에 공부 후 포스팅을 작성하였습니다. 사용 방법 1. 콜백 함수 사용 2. 콜백 함수 화살표 함수로 사용 3. 동기 콜백 함수 4. 비동기 콜백 함수 콜백 함수 사용 아래 코드는 배열 arr에서 홀수인 요소만 filter 하여 새로운 배열을 생성하는 코드입니다. ☞ filter 메서드 사용 방법 보러 가기 var ar.. JavaScript/JavaScript 문법 2021. 8. 10. [JavaScript]Window 객체와 Document 객체 Window 객체와 Document 객체 window는 브라우저의 창이고 document는 브라우저 창의 HTML 문서 객체입니다. 즉, window객체 안에 document객체가 존재합니다. window 객체 브라우저 탭의 전역 객체입니다. window로 접근 가능합니다. Chrome Console에서 window 입력 document 객체 window객체의 속성(property)입니다. document는 앞에 window가 생략되어 있으므로 window.document와 document는 동일합니다. document 또는 window.document로 접근 가능합니다. Chrome Console에서 document 입력 Console에서 document의 출력 결과는 크롬 개발자 도구(F12)에서 E.. JavaScript/JavaScript 문법 2021. 7. 28. 이전 1 2 3 4 5 다음