본문 바로가기

Webstoryboy

Category

Explanation

JAVASCRIPT/Alphabet

(65)
removeAttribute() removeAttribute() removeAttribute() 메서드는 선택한 요소의 속성 값을 삭제합니다. removeAttribute() removeAttribute() 메서드는 선택한 요소의 속성 값을 삭제합니다. 특징 설명 버전(version) ES1 결과값(return) undefined 사용성 ★★☆☆☆ 문법(Syntax) "선택자".removeAttribute("속성 이름") //속성 값 변경하기 documemt.querySelector("div").removeAttribute("class"); 선택자(selector) : 속성 값을 설정할 선택자를 설정합니다. 속성 이름(attributeName) : 속성 이름을 설정합니다. 정의(Definition) removeAttribute() 메서..
getAttribute() getAttribute() getAttribute() 메서드는 선택한 요소의 속성 값을 가져옵니다. getAttribute() getAttribute() 메서드는 선택한 요소의 속성 값을 가져옵니다. 특징 설명 버전(version) ES1 결과값(return) 속성 변경 및 추가 사용성 ★★★☆☆ 문법(Syntax) "선택자".getAttribute("속성 이름") //속성 값 변경하기 documemt.querySelector("div").getAttribute("class"); 선택자(selector) : 속성 값을 설정할 선택자를 설정합니다. 속성 이름(attributeName) : 속성 이름을 설정합니다. 정의(Definition) getAttribute() 메서드는 선택한 요소의 속성 값을 가져옵..
string.prototype.trim() trim() trim() 메서드는 문자열의 앞뒤 공백을 제거합니다. 원래 문자열을 수정하지 않고, 새 문자열을 반환합니다. trim() trim() 메서드는 문자열의 앞뒤 공백을 제거합니다. 특징 설명 버전(version) ES5 결과값(return) 문자열 사용성 ★★★☆☆ 문법(Syntax) "문자열".trim() //대문자 변경하기 let result = " javascript reference ".trim(); //javascript reference let result = " 자바스크립트 레퍼런스 ".trim(); //자바스크립트 레퍼런스 let result = " javascript reference ".replace(/^\s+|\s+$/gm,''); //javascript reference ..
string.prototype.toUpperCase() toUpperCase() toUpperCase() 메서드는 문자열을 대문자로 설정합니다. toUpperCase() toUpperCase() 메서드는 문자열을 대문자로 설정합니다. 특징 설명 버전(version) ES1 결과값(return) 문자열 사용성 ★★★☆☆ 문법(Syntax) "문자열".toUpperCase() //대문자 변경하기 let result = "javascript reference".toUpperCase(); //JAVASCRIPT REFERENCE 문자열(string) : 문자열을 설정합니다. 정의(Definition) toUpperCase() 메서드는 문자열을 대문자로 설정합니다. toUpperCase() 메서드는 문자열은 원본 문자열을 변경하지 않습니다. toUpperCase() ..
string.prototype.toLowerCase() toLowerCase() toLowerCase() 메서드는 문자열을 소문자로 설정합니다. toLowerCase() toLowerCase() 메서드는 문자열을 소문자로 설정합니다. 특징 설명 버전(version) ES1 결과값(return) 문자열 사용성 ★★★☆☆ 문법(Syntax) "문자열".toLowerCase() //대문자 변경하기 let result = "JAVASCRIPT REFERENCE".toUpperCase(); //javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition) toLowerCase() 메서드는 문자열을 소문자로 설정합니다. toLowerCase() 메서드는 문자열은 원본 문자열을 변경하지 않습니다. toLowerCase() ..
string.prototype.substring() substring() substring() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. 원래 문자열을 변경되지 않으며, slice() 메서드는 시작값이 끝나는 값보다 크면 값을 추출할 수 없지만, substring() 메서드는 시작 값이 끝나는 값보다 크면 인수가 교환되어 값을 추출합니다. substring() substring() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".substring(시작 위치) "문자열".substring(시작 위치, 끝나는 위치) "javascript reference..
string.prototype.substr() substr() substr() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. substr() substr() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자열(string) 사용성 ☆☆☆☆☆ 문법(Syntax) "문자열".substr(시작 위치) "문자열".substr(시작 위치, 길이) "javascript reference".substr(0) //javascript reference "javascript reference".substr(1) //avascript reference "javascript reference".substr(2) //vascript re..
string.prototype.split() split() split() 메서드는 문자열을 부분 문자열로 구분하고 배열로 반환합니다. split() split() 메서드는 문자열을 부분 문자열로 구분하고 배열로 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 배열(array) 사용성 ★★★★☆ 문법(Syntax) "문자열".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 = st..
string.prototype.search() search() search() 메서드는 문자열(정규식)을 검색하고 위치값(숫자)을 반환합니다. search() search() 메서드는 문자열(정규식)을 검색하고 위치값(숫자)을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 숫자(index) or -1 사용성 ★★★☆☆ 문법(Syntax) "문자열".search(검색값) "문자열".search(정규식 표현) "javascript reference".search('javascript') //0 "javascript reference".search('reference') //11 "javascript reference".search('r') //6 "javascript reference".search..
string.prototype.padStart() padStart() padStart() 메서드는 주어진 길이에 맞게 앞 문자열을 채우고, 새로운 문자열을 반환합니다. padStart() padStart() 메서드는 주어진 길이에 맞게 앞 문자열을 채우고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES8 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".padStart(길이) "문자열".padStart(길이, 문자열) "456".padStart(1, '0'); //456 "456".padStart(4, '0'); //0456 "456".padStart(5, '0'); //00456 "456".padStart(6, '1'); //111456 "456".padStart..
string.prototype.replace() replace() replace() 메서드는 문자열을 부분 문자열로 구분하고 배열로 반환합니다. replace() replace() 메서드는 문자열을 부분 문자열로 구분하고 배열로 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 배열(array) 사용성 ★★★☆☆ 문법(Syntax) "문자열".replace(찾을 문자열) "문자열".replace(찾을 문자열, 변경할 문자열) "문자열".replace(정규식) "문자열".replace(정규식, 변경할 문자열) "javascript reference".replace('javascript', '자바스크립트') //자바스크립트 reference "javascript reference".replace('e',..
string.prototype.repeat() repeat() repeat() 메서드는 문자열을 복사하여, 복사한 문자열을 반환합니다. repeat() repeat() 메서드는 문자열을 복사하여, 복사한 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES6 결과값(return) 배열(array) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".repeat(숫자) "javascript reference".repeat(0); //'' "javascript reference".repeat(1); //javascript reference "javascript reference".repeat(2); //javascript referencejavascript reference 문자열(string) : 문자열을 설정합니다. 숫..
string.prototype.padEnd() padEnd() padEnd() 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다. padEnd() padEnd() 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES8 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".padStart(길이) "문자열".padStart(길이, 문자열) "456".padStart(1, '0'); //456 "456".padStart(4, '0'); //4560 "456".padStart(5, '0'); //45600 "456".padStart(6, '1'); //456111 "456".padStart(6, '12'..
string.prototype.match() match() match() 메서드는 문자열(정규식)을 검색하고 문자값(배열)을 반환합니다. match() match() 메서드는 문자열(정규식)을 검색하고 문자값(배열)을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 배열(array) 사용성 ★★★☆☆ 문법(Syntax) "문자열".match(검색값) "문자열".match(정규식 표현) "javascript reference".match('javascript') //javascript "javascript reference".match('reference') //reference "javascript reference".match('r') //r "javascript reference".match..
string.prototype.endsWith() endsWith() endWidth() 메서드는 끝나는 문자열에서 문자열을 검색하여 불린(true, false)을 반환합니다. endsWith() endWidth() 메서드는 끝나는 문자열에서 문자열을 검색하여 불린(true, false)을 반환합니다. 특징 설명 유형(type) String 버전(version) ES6 결과값(return) 불린(true or false) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".endsWith(검색 문자열) "문자열".endsWith(검색 문자열, 시작 위치값) "javascript reference".endsWith('reference') //true "javascript reference".endsWith('e') //true "javascript refer..
string.prototype.charCodeAt() charCodeAt() charCodeAt() 메서드는 지정한 숫자(index)의 유니코드 값을 반환합니다. charCodeAt() charCodeAt() 메서드는 지정한 숫자(index)의 유니코드 값을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 숫자(UTF-16) 사용성 ★★★☆☆ 문법(Syntax) "문자열".charCodeAt(숫자) "javascript reference".charCodeAt() //106 "javascript reference".charCodeAt('0') //106 "javascript reference".charCodeAt('1') //97 "javascript reference".charCodeAt('2') //1..
string.prototype.charAt() charAt() charAt() 메서드는 지정한 숫자(index)의 단일 문자 값을 반환합니다. charAt() charAt() 메서드는 지정한 숫자(index)의 단일 문자 값을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".charAt(숫자) "javascript reference".charAt() //j "javascript reference".charAt('0') //j "javascript reference".charAt('1') //a "javascript reference".charAt('2') //v 문자열(string) : 문자열을 설정합니다. 숫자(index) : ..
unshift() unshift() unshift() 메서드는 배열 앞에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. unshift() unshift() 메서드는 배열 앞에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. 특징 설명 유형(type) Array 버전(version) ES1 결과값(return) 길이값(length) 사용성 ★★★★☆ 문법(Syntax) "배열".unshift(요소) "배열".unshift(요소1, 요소2,...) const arr = [100, 200, 300, 400, 500]; const text1 = arr.unshift(600); //600, 100, 200, 300, 400, 500 const text2 = arr.unshift(600,700,800,900); //..
string.prototype.toString() toString() toString() 메서드는 데이터를 문자열로 변환하고, 새로운 문자열을 반환합니다. toString() toString() 메서드는 데이터를 문자열로 변환하고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".toString() "javascript reference".toString() //javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition) toString() 메서드는 데이터를 문자열로 변환하고, 새로운 문자열을 반환합니다. 문자열 변경과 관련된 메서드 slice() 메서드는 문자열에서..
string.prototype.slice() slice() slice() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. slice() slice() 메서드는 문자열에서 원하는 값을 추출하여 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★★☆ 문법(Syntax) "문자열".slice(시작 위치) "문자열".slice(시작 위치, 끝나는 위치) "javascript reference".slice(0) //javascript reference "javascript reference".slice(1) //avascript reference "javascript reference".slice(2) //vascript referen..
shift() shift() shift() 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 반환합니다. shift() shift() 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 반환합니다. 특징 설명 유형(type) Array 버전(version) ES1 결과값(return) 제거한 요소 사용성 ★★★☆☆ 문법(Syntax) "배열".shift() const arr = [100, 200, 300, 400, 500]; const text = arr.shift(); console.log(text) //100 console.log(arr) //[200, 300, 400, 500] 배열(array) : 배열을 설정합니다. 정의(Definition) shift() 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 ..
push() push() push() 메서드는 배열 끝에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. push() push() 메서드는 배열 끝에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. 특징 설명 유형(type) Array 버전(version) ES1 결과값(return) 길이값(length) 사용성 ★★★★☆ 문법(Syntax) "배열".push(요소) "배열".push(요소1, 요소2,...) const arr = [100, 200, 300, 400, 500]; const text1 = arr.push(600); //100, 200, 300, 400, 500, 600 const text2 = arr.push(600,700,800,900); //100, 200, 300, 400, 500,..
pop() pop() pop() 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. pop() pop() 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. 특징 설명 유형(type) Array 버전(version) ES1 결과값(return) 제거한 요소 사용성 ★★★☆☆ 문법(Syntax) "배열".pop() const arr = [100, 200, 300, 400, 500]; const text = arr.pop(); console.log(text) //500 console.log(arr) //[100, 200, 300, 400] 배열(array) : 배열을 설정합니다. 정의(Definition) pop() 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. pop(..
string.prototype.lastIndexOf() lastIndexOf() lastIndexOf() 메서드는 문자열을 역순으로 검색하고 위치값(숫자)을 반환합니다. lastIndexOf() lastIndexOf() 메서드는 문자열을 역순으로 검색하고 위치값(숫자)을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 숫자 or -1 사용성 ★★★☆☆ 문법(Syntax) "문자열".lastIndexOf(검색값) "문자열".lastIndexOf(검색값, 위치값) "javascript reference".lastIndexOf('javascript') //0 "javascript reference".lastIndexOf('javascripts') //-1 "javascript reference".lastInde..
join() join() join() 메서드는 배열의 문자열을 하나로 문자열로 반환합니다. join() join() 메서드는 배열의 문자열을 하나로 문자열로 반환합니다. 특징 설명 유형(type) Array 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★★☆ 문법(Syntax) "배열".join(분리기호) const arr = [100, 200, 300, 400, 500]; const text1 = arr.join("*"); //100*200*300*400*500 const text2 = arr.join("-"); //100-200-300-400-500 const text3 = arr.join(); //100,200,300,400,500 const text3 = arr.join(..
string.prototype.indexOf() indexOf() indexOf() 메서드는 문자열에서 특정 문자의 위치를 찾습니다. 문자열 내에 문자들은 왼쪽부터 순번이 매겨지고, 결과 값으로 순번이 반환됩니다. 만약 찾는 문자가 없다면, -1 값을 반환합니다. indexOf() indexOf() 메서드는 문자열에서 특정 문자의 위치를 찾습니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 숫자 or -1 사용성 ★★★☆☆ 문법(Syntax) "문자열".indexOf(검색값) "문자열".indexOf(검색값, 위치값) "javascript reference".indexOf('javascript') //0 "javascript reference".indexOf('javascripts') //-1 "javas..
string.prototype.includes() includes() includes() 메서드는 문자열 포함 여부를 검색하여 불린(true, false)을 반환합니다. includes() includes() 메서드는 문자열 포함 여부를 검색하여 불린(true, false)을 반환합니다. 특징 설명 유형(type) String 버전(version) ES6 결과값(return) 불린(true or false) 사용성 ★★★☆☆ 문법(Syntax) "문자열".includes(검색값) "문자열".includes(검색값, 시작값) "javascript reference".includes('javascript') //true "javascript reference".includes('j') //true "javascript reference".includes('..
string.prototype.concat() concat() concat() 메서드는 둘 이상의 문자열을 결합하여 새로운 문자열을 반환합니다. concat() concat() 메서드는 둘 이상의 문자열을 결합하여 새로운 문자열을 반환합니다. 특징 설명 유형(type) String 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".concat(문자열, 문자열,....) 'javascript'.concat('reference') //javascriptreference 'javascript'.concat(' ', 'reference') //javascript reference 'javascript'.concat(', ', 'reference') //javascript, referenc..
classList.contains() classList.contains() classList.contains() 메서드는 선택한 요소한테 클래스가 있는지 확인하고 불린을 반환합니다. classList는 읽기 전용 속성이며, add(), remove(), toggle(), replace() 메서드를 추가하여 사용할 수 있습니다. classList.contains() classList.contains() 메서드는 선택한 요소한테 클래스가 있는지 확인하고 불린을 반환합니다. 특징 설명 버전(version) ES1 결과값(return) 블린(true or false) 사용성 ★★★★☆ 문법(Syntax) "선택자".classList.contains("클래스 이름") //클래스 이름 포함여부 확인 documemt.querySelector("div")..
classList.toggle() classList.toggle() classList.toggle() 메서드는 선택한 요소한테 클래스를 추가/삭제합니다. classList는 읽기 전용 속성이며, add(), remove(), toggle(), replace() 메서드를 추가하여 사용할 수 있습니다. classList.toggle() classList.toggle() 메서드는 선택한 요소한테 클래스를 추가/삭제합니다. 특징 설명 버전(version) ES1 결과값(return) 클래스 추가/삭제 사용성 ★★★★★ 문법(Syntax) "선택자".classList.toggle("클래스 이름") "선택자".classList.toggle("클래스 이름", "클래스 이름",....) //클래스 이름을 추가하는 경우 documemt.querySele..
1 2 3