javascript14 [JQuery] 특정 값이 포함되어 있는 지 확인할 수 있는 배열 함수들(indexOf, includes, findIndex, some) 배열 안에 특정 값을 찾아야 하는 경우가 자주 있는데, 그럴때 사용할수있는 함수들을 정리하고 비교해본다. 배열 내 특정 값 포함 여부 확인 함수배열 내 특정 값이 포함되어있는지 확인하기 위한 함수는 아래와 같이 4가지로 볼수 있는데, 기능을 수행하는 방식이 조금씩 다르기 때문에 상황에 맞도록 사용하는 것이 중요하다. indexOf()찾으려는 값과 일치하는 '첫번째 index'를 반환 includes()특정 값 포함 '여부(boolean)' 반환하며, IE에서는 호환이 되지 않음 findIndex()callback함수 조건에 충족하는 값의 '첫번째 index'를 반환하며, IE에서는 호환이 되지 않음 some()callback함수 조건에 충족하는 값의 포함 '여부(boolean)' 반환 함수 .. 2025. 3. 19. [JavaScript] var, let, const 자바스크립트에서 변수를 선언하는 방법에는 var, let, const 세 가지가 있습니다. 1. 중복 선언 가능 여부 var : 중복 선언 가능 - var는 중복해서 변수 선언을 여러 번 해도 에러 없이 각각 다른 값이 출력될 수 있음 - 초기화 없이 선언만 한 경우엔 변수 선언문 자체가 무시됨 (이 또한 에러발생 하지 않음) - 이는 기존에 선언했던 변수의 존재를 잊고 값을 재할당하게 되는 등의 실수를 저지르기 쉽다는 단점이 있음 // 변수 선언 + 초기화 var testVar = "TEST1"; console.log(testVar); // TEST1 // 변수 선언 + 초기화 var testVar = "TEST1"; console.log(testVar); // TEST1 // 변수 선언 (초기화 X).. 2024. 4. 22. [JavaScript] 요일 구하기 자바스크립트의 Date 객체를 사용하여 무슨 요일인지 알 수 있습니다. new Date(yyyy-MM-dd).getDay() 날짜의 요일은 new Date(yyyy-MM-dd).getDay() 함수를 통해 구할 수 있습니다. 자세한 사용방법은 다음과 같습니다. //ex) getDayOfWeek('2023-04-04') 의 형태로 사용 function getDayOfWeek(yyyyMMdd){ const dayOfWeek = new Date(yyyyMMdd).getDay(); //0:일, 1:월, 2:화, 3:수, 4:목, 5:금, 6:토 return dayOfWeek; } 위 getDayOfWeek함수는 매개변수로 들어오는 날짜의 요일을 구할수있습니다. 날짜의 형식은 yyyy-MM-dd와 같은 형태이며,.. 2023. 4. 4. [JavaScript] 배열의 특정 값 삭제하기 1. 배열 전체 값 삭제 방법 1 배열 = []; 의 형태로 배열의 전체 값을 삭제(초기화) 할 수 있습니다. 방법 2 배열.length = 0; 의 형태로 배열의 길이를 0으로 초기화하여 전체 값을 삭제(초기화) 할 수 있습니다. //방법 1 //배열 선언 let arr1 = ['aaa', 'bbb', 'ccc']; // 배열 값 전체 삭제 arr1 = []; console.log(arr1.length);//0 출력 //방법 2 //배열 선언 let arr2 = ['ddd', 'eee', 'fff']; // 배열 값 0으로 변경 arr2.length = 0; console.log(arr2.length);//0 출력 2. 배열 첫 번째 값 삭제 자바스크립트의 shift 함수를 사용하여 배열의 첫 번째 값.. 2023. 1. 19. [JavaScript] 현재 날짜, 특정 날짜 - Date() 자바스크립트의 Date 객체를 사용하여 현재 날짜를 구할 수 있고, 특정 날짜를 구할 수 있습니다. Date() Date 객체는 생성자 함수이며, 날짜와 시간을 가지는 인스턴스를 생성합니다. 생성된 인스턴스는 기본적으로 현재 날짜와 시간을 나타내는 값을 가집니다. 현재 날짜와 시간이 아닌 특정 날짜와 시간을 다루고 싶은 경우, Date 생성자 함수에 명시적으로 특정 날짜와 시간 정보를 매개변수로 지정합니다. Date() 사용 방법 1. 현재 시간 new Date(); 를 이용하여 Date 객체를 생성합니다. var date1 = new Date(); // 현재 날짜 및 시간, Fri Jan 06 2023 16:24:15 GMT+0900 (한국 표준시) 2. 특정 시간 new Date(매개변수); 의 형태.. 2023. 1. 6. [JavaScript] replace is not a function 오류 JavaScript의 replace함수를 사용하던 와중 아래와 같은 경고문이 노출되며 작동되지 않았습니다. 오류메시지 노출 아래 코드와 같이 매개변수로 들어오는 값의 html 태그를 치환시키기 위한 함수를 사용 중이었습니다. escapeHtml = function( text ) { var map = { '&': '&', '': '>', '"': '"', "'": ''' }; return text.replace(/[&"']/g, function(m) { return map[m]; }); }; replace함수는 replace를 하려고 하는 데이터가 parseInt, 즉 숫자일 때에 오류가 발생합니다. 오류 해결 이러한 오류가 발생한다면 매개변수를 문자열로 교체한 뒤 replace 하게 되면 정상적.. 2023. 1. 4. [JavaScript] 버튼에 강제 클릭 발생 시키기 - click() 자바스크립트를 통하여 강제로 클릭 이벤트를 발생시킬 수 있습니다. click 함수 자바스크립트의 click 함수는 사용자가 클릭을 하지 않아도 강제적으로 클릭 이벤트를 발생시키는 함수입니다. 아래와 같은 형태로 사용할수있습니다. element.click() 자세한 사용 예시는 아래 코드를 통해 확인해볼 수 있습니다. 페이지 진입 시, document.getElementById('btn_aaa').click(); 코드가 실행됩니다. 1) id의 값이 btn_aaa 인 버튼에 click함수를 걸어주게 됩니다. 2) click함수로 인하여 id의 값이 btn_aaa 인 버튼이 눌려지게 됩니다. 3) 해당 버튼이 onclick 이벤트로 가지고 있는 afterBtnClick 함수가 실행되게 되어 "btn_aaa .. 2022. 12. 29. [JavaScript]카카오톡 인앱 브라우저 닫기(안드로이드, IOS) 카카오톡 인앱 브라우저 닫기 버튼이 동작하는 방식이 안드로이드, IOS에 따라 다릅니다. 아래와 같이 사용할 수 있습니다. 사용 방법 안드로이드 kakaotalk://inappbrowser/close IOS kakaoweb://closeBrowser 사용 예시 코드 function ClosePage(){ var _ua = window.navigator.userAgent || window.navigator.vgjendor || window.opera; //alert(_ua.toLocaleLowerCase().indexOf("kakaotalk")) if (_ua.toLocaleLowerCase().indexOf("kakaotalk") > -1) { //alert("1") window.location.href.. 2022. 8. 17. [JavaScript]Input type number의 maxlength 적용(slice 메서드) HTML에서 input 태그의 타입 중 하나인 number 타입을 사용할 때 maxlength 속성을 이용하여 입력 가능한 숫자의 수를 정하려고 하지만, 적용이 잘 되지 않았습니다. 검색을 해보니 input type='number'의 경우 maxlength가 작동되지 않는 사례를 발견할 수 있었고, 해결방법 또한 알 수 있었습니다. 해결 방안 바로 JavaScript를 이용하여 입력 글자의 수를 조절할 수 있습니다. 아래는 number 타입의 input 태그입니다. maxlength는 8로 설정하였지만 그 이상 입력되는 게 문제입니다. 이럴 경우 JavaScript를 사용하여 해결할 수 있는데, 아래와 같이 input 태그에 oninput을 할 경우 연결할 메서드를 선언 합니다. 코드 분석 타입이 "nu.. 2022. 5. 20. 이전 1 2 다음 반응형
