filter(), map(), Array.from()
filter(), map(), Array.from() filter(), map(), Array.from() 메서드에 대해 알아 봅시다. filter() filter() 메서드는 조건을 걸 수 있습니다. 번호 기본값 메서드 리턴값 const arrNum = [100, 200, 300, 400, 500]; const result = arrNum.filter(el => el === 300); document.querySelector(".sample12_N1").innerHTML = "1"; document.querySelector(".sample12_Q1").innerHTML = "[100, 200, 300, 400, 500]"; document.querySelector(".sample12_M1").inner..
2022. 9. 28.
unshift() / shift(), reverse() / sort(), concat()
unshift() / shift(), reverse() / sort(), concat() unshift() / shift(), reverse() / sort(), concat() 메서드에 대해 알아 봅시다. unshift() / shift() unshift() 메서드는 배열 처음 요소에 추가, shift() 메서드는 배열 처음 요소에 삭제 번호 기본값 메서드 리턴값 결과값 const arrNum1 = [100, 200, 300, 400, 500]; const arrNumUnshift =arrNum1.unshift(600); document.querySelector(".sample04_N1").innerHTML = "1"; document.querySelector(".sample04_Q1").innerHT..
2022. 9. 28.
reduce() / reduceRight(), slice(), splice()
reduce() / reduceRight(), slice(), splice() reduce() / reduceRight(), slice(), splice() 메서드에 대해 알아 봅시다. reduce() / reduceRight() reduce() / reduceRight() 메서드는 배열 요소를 하나로 정리해 줍니다. 번호 기본값 메서드 리턴값 const arrNum1 = [100, 200, 300, 400, 500]; const arrReduce1 = arrNum1.reduce(element => element); document.querySelector(".sample07_N1").innerHTML = "1"; document.querySelector(".sample07_Q1").innerHTML =..
2022. 9. 28.
jQuery - 스타일 메서드
jQuery 스타일 관련 메서드 css() 메서드 실행 분류 형식 취득 $("div").css("width"); 생성, 변경 $("div").css("background-color", "red").css("padding", "10px"); $("div").css({background-color, "red", padding, "10px"}); 콜백 함수 $("div").css("width", function(index, w) { // index는 각 div 요소의 index 0, 1, 2 // w는 각 div 요소의 width 값 retun css 속성 // 각 div 요소의 css 속성을 변경합니다. }); .... 내용 내용 내용 예제 jQuery 결과 width, height 관련 메서드 메서드 종류..
2022. 9. 4.
jQuery - 속성 메서드
jQuery 속성 관련 메서드 attr() 메서드 선택한 요소의 attribute (속성) 를 선택, 생성, 변경할 수 있습니다. 실행 분류 형식 취득 $("a").attr("href"); 생성, 변경 $("a").attr("href", "http://icoxpublish.com").attr("target", "_blank"); $("a").attr({href: "http://icoxpublish.com", target: "_blank"}); 콜백함수 $("a").attr("herf", function(index, h) { //index는 각 a 요소의 index 0, 1, 2 //h는 각 a 요소 href 속성 return attribute(속성) // 각 a 요소의 속성을 생성 및 변경합니다. });..
2022. 9. 4.
split()
split() 문자열에서 원하는 값을 추출해 배열로 반환해 줍니다. split() 문자 객체를 지정한 구분자를 이용하여 여러개의 문자열로 나눕니다. "문자열".split(구분자); "문자열".split(정규식 표현); "문자열".split(구분자, 갯수); const str1 = "javascript reference"; const currentStr1 = str1.split(''); //['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't', ' ', 'r', 'e', 'f', 'e', 'r', 'e', 'n', 'c', 'e'] const currentStr2 = str1.split(' '); //['javascript', 'reference'], 한칸 띄웠음 con..
2022. 8. 17.
정규표현식
정규표현식 정규식 표현으로 문자열에서 특정 문자의 조합을 찾을 수 있습니다. 정규표현식 객체 주요 패턴 패턴 설명 abc abc 문자열을 검색합니다. /abc/는 'abc' [abc] a, b, c 중 문자 하나를 검색합닌다. /[abc]d/는 'ad', 'bd', 'cd' [^abc] a, b, c를 제외한 문자 하나를 검색합니다. /^[abc]d/는 'ed', 'fd', 'gd' [A-Z] 알파벳 대문자 문자를 검색합니다. [a-z] 알파벳 소문자 문자를 검색합니다. [0-9] 0-9까지의 숫자를 검색합니다. . 하나의 문자를 검색합니다. 만약 '마침표' 문자 그대로의 의미를 사용할 경우 '￦.'으로 표현해야 합니다. \w 알파벳, 숫자, _를 검색합니다. \W 알파벳, 숫자, _를 제외하고 검색합니..
2022. 8. 16.
<
