CSS HTML JAVASCRIPT 웹디자인기능사 GSAP 포트폴리오 유튜브 Reference/JAVASCRIPT43 concat 메서드는 매개변수로 전달된 배열을 받어, 결합된 새로운 배열을 반환합니다. Reference/Javascript concat 메서드는 매개변수로 전달된 배열을 받어, 결합된 새로운 배열을 반환합니다. by @webs 2022. 11. 7. concat() concat() 메서드는 매개변수로 전달된 배열을 받어, 결합된 새로운 배열을 반환합니다. 특징 설명 유형(type) String.prototype.concat() / Array.prototype.concat() 버전(version) ES1 결과값(return) 문자열(String) or 배열(Array) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".concat(문자열, 문자열,....) "배열".concat(문자열, 문자열,....) const str = "javascript"; str.concat("reference").. 2022. 12. 14. at 메서드는 지정한 숫자를 받아, 배열에서 해당 되는 인덱스의 요소를 반환합니다. Reference/Javascript at 메서드는 지정한 숫자를 받아, 배열에서 해당 되는 인덱스의 요소를 반환합니다. by @webs 2022. 11. 7. at() at() 메서드는 지정한 숫자(index)를 받아, 배열에서 해당 되는 인덱스의 요소를 반환합니다. 양수와 음수 모두 설정 할 수 있으며, 음수 값의 경우 뒤에서부터 인덱스 값을 설정합니다. at() 메서드는 배열 또는 문자열에서 둘다 사용이 가능합니다. 특징 설명 유형(type) String.prototype.at() / Array.prototype.at() 버전(version) ES6 결과값(return) 문자열 요소 or undefined 사용성 ★★☆☆☆ 문법(Syntax) "배열".at(인덱스) const arr = [1, 2,.. 2022. 12. 14. reverse 메서드는 배열 요소의 순서를 반대로 하고, 반대로 된 배열을 반환합니다. Reference/Javascript reverse 메서드는 배열 요소의 순서를 반대로 하고, 반대로 된 배열을 반환합니다. by @webs 2022. 12. 12. reverse() reverse() 메서드는 배열 요소의 순서를 반대로 하고, 반대로 된 배열을 반환합니다. 특징 설명 유형(type) array.prototype.reverse() 버전(version) ES1 결과값(return) 배열(array) 사용성 ★★★☆☆ 문법(Syntax) "배열".reverse() const arr = [100, 200, 300, 400, 500]; const text1 = arr.reverse(); console.log(text1) //[500, 400, 300, 200, 100] 배열(array) : 배열.. 2022. 12. 14. pop 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. Reference/Javascript pop 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. by @webs 2022. 12. 12. pop() pop() 메서드는 배열 마지막 요소를 제거하고, 제거한 요소를 반환합니다. 특징 설명 유형(type) array.prototype.pop() 버전(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) : 배열을 설정합니다. 정의(Definit.. 2022. 12. 13. shift 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 반환합니다. Reference/Javascript shift 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 반환합니다. by @webs 2022. 12. 12. shift() shift() 메서드는 배열 처음 요소를 제거하고, 제거한 요소를 반환합니다. 특징 설명 유형(type) array.prototype.shift() 버전(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) : 배열을 설정합니다. .. 2022. 12. 13. unshift 메서드는 배열 앞에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. Reference/Javascript unshift 메서드는 배열 앞에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. by @webs 2022. 12. 12. unshift() unshift() 메서드는 배열 앞에 요소를 추가하고, 배열의 새로운 길이 값을 반환합니다. 특징 설명 유형(type) array.prototype.unshift() 버전(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.. 2022. 12. 13. push 메서드는 배열 끝에 요소를 추가하고, 배열의 새로운 길이값을 반환합니다. Reference/Javascript push() 메서드는 배열 끝에 요소를 추가하고, 배열의 새로운 길이값을 반환합니다. by @webs 2022. 12. 12. push() push() 메서드는 배열 끝에 요소를 추가하고, 배열의 새로운 길이값을 반환합니다. 특징 설명 유형(type) array.prototype.push() 버전(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 = a.. 2022. 12. 13. join 메서드는 배열의 요소를 추가하여, 하나의 문자열로 반환합니다. Reference/Javascript join 메서드는 배열의 요소를 추가하여, 하나의 문자열로 반환합니다. by @webs 2022. 12. 12. join() join() 메서드는 배열의 요소를 추가하여, 하나의 문자열로 반환합니다. 특징 설명 유형(type) array.prototype.join() 버전(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 tex.. 2022. 12. 13. offsetWidth 속성은 요소의 가로 값을 가져옵니다. Reference/Javascript offsetWidth 속성은 요소의 가로 값을 가져옵니다. by @webs 2022. 12. 02. offsetWidth offsetWidth 속성은 요소의 가로 값(보더/패딩 포함)을 가져옵니다. 데이터 값을 수정할 수 없고, 값만 가져올 수 있는 읽기 전용 속성입니다. 특징 설명 유형(type) HTMLElement.offsetWidth 버전(version) ES1 결과값(return) 정수(integer) 사용성 ★★☆☆☆ 문법(Syntax) HTMLElement.offsetWidth document.querySelector(".box").offsetWidth 요소(element) : 선택할 요소를 설정합니다. 정의(Definition) offsetWidth 속.. 2022. 12. 2. offsetTop 속성은 요소의 Y축 위치 값을 가져옵니다. Reference/Javascript offsetTop 속성은 요소의 Y축 위치 값을 가져옵니다. by @webs 2022. 12. 02. offsetTop offsetTop 속성은 요소의 Y축 위치 값(문서 기준)을 가져옵니다. 데이터 값을 수정할 수 없고, 값만 가져올 수 있는 읽기 전용 속성입니다. 특징 설명 유형(type) HTMLElement.offsetTop 버전(version) ES1 결과값(return) 정수(integer) 사용성 ★★★☆☆ 문법(Syntax) HTMLElement.offsetTop document.querySelector(".box").offsetTop 요소(element) : 선택할 요소를 설정합니다. 정의(Definition) offsetTop 속성은 요소의 Y축 위.. 2022. 12. 2. offsetLeft 속성은 요소의 X축 위치 값을 가져옵니다. Reference/Javascript offsetLeft 속성은 요소의 X축 위치 값을 가져옵니다. by @webs 2022. 12. 02. offsetLeft offsetLeft 속성은 요소의 X축 위치 값(문서 기준)을 가져옵니다. 데이터 값을 수정할 수 없고, 값만 가져올 수 있는 읽기 전용 속성입니다. 특징 설명 유형(type) HTMLElement.offsetLeft 버전(version) ES1 결과값(return) 정수(integer) 사용성 ★★☆☆☆ 문법(Syntax) HTMLElement.offsetLeft document.querySelector(".box").offsetLeft 요소(element) : 선택할 요소를 설정합니다. 정의(Definition) offsetLeft 속성은 요.. 2022. 12. 2. offsetHeight 속성은 요소의 세로 값을 가져옵니다. Reference/Javascript offsetHeight 속성은 요소의 세로 값을 가져옵니다. by @webs 2022. 12. 02. offsetHeight offsetHeight 속성은 요소의 세로 값(보더/패딩 포함)을 가져옵니다. 데이터 값을 수정할 수 없고, 값만 가져올 수 있는 읽기 전용 속성입니다. 특징 설명 유형(type) HTMLElement.offsetHeight 버전(version) ES1 결과값(return) 정수(integer) 사용성 ★★☆☆☆ 문법(Syntax) HTMLElement.offsetHeight document.querySelector(".box").offsetHeight 요소(element) : 선택할 요소를 설정합니다. 정의(Definition) offsetH.. 2022. 12. 2. clientLeft 속성은 요소의 X축 위치 값을 가져옵니다. Reference/Javascript clientLeft 속성은 요소의 X축 위치 값을 가져옵니다. by @webs 2022. 12. 02. clientLeft clientLeft 속성은 요소의 X축 위치 값(부모 기준)을 가져옵니다. 위치 값만 가져올 수 있으며, 수정할 수 없는 읽기 전용 속성입니다. element.getBoundingClientRect()에서도 속성 값을 가져올 수 있습니다. 특징 설명 유형(type) Element.clientLeft 버전(version) ES1 결과값(return) 숫자(number) 사용성 ★★★☆☆ 문법(Syntax) element.clientLeft document.querySelector(".box").clientLeft 요소(element) : 선택할 요.. 2022. 12. 2. clientTop 속성은 요소의 Y축 위치 값을 가져옵니다. Reference/Javascript clientTop 속성은 요소의 Y축 위치 값을 가져옵니다. by @webs 2022. 11. 17. clientTop clientTop 속성은 요소의 Y축 위치 값(부모 기준)을 가져옵니다. 위치 값만 가져올 수 있으며, 수정할 수 없는 읽기 전용 속성입니다. element.getBoundingClientRect()에서도 속성 값을 가져올 수 있습니다. 특징 설명 유형(type) Element.clientTop 버전(version) ES1 결과값(return) 숫자(number) 사용성 ★★★☆☆ 문법(Syntax) element.clientTop document.querySelector(".box").clientTop 요소(element) : 선택할 요소를 설정합.. 2022. 12. 2. clientWidth 속성은 요소의 가로 값을 가져옵니다. Reference/Javascript clientWidth 속성은 요소의 가로 값을 가져옵니다. by @webs 2022. 11. 17. clientWidth clientWidth 속성은 요소의 가로 값(마진/보더 불포함)을 가져옵니다. 마진과 보더 값이 있다면, 포함되어 있지 않습니다. 가로 값만 가져올 수 있으며, 수정할 수 없는 읽기 전용 속성입니다. 익스프롤러에서 사용된 오래 사용된 속성이며, element.getBoundingClientRect()에서도 속성 값을 가져올 수 있습니다. 특징 설명 유형(type) Element.clientWidth 버전(version) ES1 결과값(return) 숫자(number) 사용성 ★★★☆☆ 문법(Syntax) element.clientWidth docu.. 2022. 12. 2. clientHeight 속성은 요소의 세로 값을 가져옵니다. Reference/Javascript clientHeight 속성은 요소의 세로 값을 가져옵니다. by @webs 2022. 11. 17. clientHeight clientHeight 속성은 요소의 세로 값(마진/보더 불포함)을 가져옵니다. 마진과 보더 값이 있다면 포함되어 있지 않습니다. 높이 값만 가져올 수 있으며, 수정할 수 없는 읽기 전용 속성입니다. 익스프롤러에서 사용된 오래 사용된 속성이며, element.getBoundingClientRect()에서도 속성 값을 가져올 수 있습니다. 특징 설명 유형(type) Element.clientHeight 버전(version) ES1 결과값(return) 숫자(number) 사용성 ★★★☆☆ 문법(Syntax) element.clientHeight .. 2022. 12. 2. valueOf 메서드는 객체의 원시값을, 문자열로 반환합니다. Reference/Javascript valueOf 메서드는 객체의 원시값을, 문자열로 반환합니다. by @webs 2022. 11. 23. valueOf() valueOf() 메서드는 객체의 원시값을, 문자열로 반환합니다. 특징 설명 유형(type) String.prototype.valueOf() 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".valueOf() //문자열 반환하기 "javascript reference".valueOf(); //javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition) valueOf() 메서드는 객체의 원시값을, 문자열로 반환합니다. toStrin.. 2022. 11. 24. toString() 메서드는 데이터를 문자열로 변환하고, 반환합니다. Reference/Javascript toString 메서드는 데이터를 문자열로 변환하고, 반환합니다. by @webs 2022. 11. 24. toString() toString() 메서드는 데이터를 문자열로 변환하고, 반환합니다. 특징 설명 유형(type) String.prototype.toString() Object.prototype.toString() Number.prototype.toString() Array.prototype.toString() Date.prototype.toString() Boolean.prototype.toString() 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".toString() //문자열 반환.. 2022. 11. 24. toUpperCase 메서드는 문자열을 대문자로 설정하고, 대문자 문자열을 반환합니다. Reference/Javascript toUpperCase 메서드는 문자열을 대문자로 설정하고, 대문자 문자열을 반환합니다. by @webs 2022. 11. 17. toUpperCase() toUpperCase() 메서드는 문자열을 대문자로 설정하고, 대문자 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.toUpperCase() 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".toUpperCase() //대문자로 변경하기 "javascript reference".toUpperCase(); //JAVASCRIPT REFERENCE 문자열(string) : 문자열을 설정합니다. 정의(Definition).. 2022. 11. 23. toLowerCase 메서드는 문자열을 소문자로 설정하고, 새로운 문자열을 반환합니다. Reference/Javascript toLowerCase 메서드는 문자열을 소문자로 설정하고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 17. toLowerCase() toLowerCase() 메서드는 문자열을 소문자로 설정하고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.toLowerCase() 버전(version) ES1 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".toLowerCase() //소문자로 변경하기 "JAVASCRIPT REFERENCE".toUpperCase(); //javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition).. 2022. 11. 23. trimEnd 메서드는 뒤 공백을 제거하고, 새로운 문자열을 반환합니다. Reference/Javascript trimEnd() 메서드는 뒤 공백을 제거하고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 17. trimEnd() trimEnd() 메서드는 뒤 공백을 제거하고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.trimEnd() 버전(version) ES10 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".trim() //공백 제거하기 let result = " javascript reference ".trimEnd(); // javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition) trimEnd() 메서드는 문자.. 2022. 11. 17. trimStart() 메서드는 앞 공백을 제거하고, 새로운 문자열을 반환합니다. Reference/Javascript trimStart() 메서드는 앞 공백을 제거하고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 10. trimStart() trimStart() 메서드는 앞 공백을 제거하고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.trimStart() 버전(version) ES10 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".trim() //공백 제거하기 let result = " javascript reference ".trimStart(); //javascript reference 문자열(string) : 문자열을 설정합니다. 정의(Definition) trimStar.. 2022. 11. 17. trim() 메서드는 앞/뒤 공백을 제거하고, 새로운 문자열을 반환합니다. Reference/Javascript trim() 메서드는 앞/뒤 공백을 제거하고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 10. trim() trim() 메서드는 앞/뒤 공백을 제거하고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.trim() 버전(version) ES5 결과값(return) 문자열(string) 사용성 ★★★☆☆ 문법(Syntax) "문자열".trim() //대문자 변경하기 let result = " javascript reference ".trim(); //javascript reference let result = " 자바스크립트 레퍼런스 ".trim(); //자바스크립트 레퍼런스 let result = " java.. 2022. 11. 17. padEnd 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다. Reference/Javascript padEnd() 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 10. padEnd() padEnd() 메서드는 주어진 길이에 맞게 뒤 문자열을 채우고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.padEnd() 버전(version) ES8 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".padEnd(길이) "문자열".padEnd(길이, 문자열) "456".padEnd(1, '0'); //456 "456".padEnd(4, '0'); //4560 "456".padEnd(5, '0'); //45600 "456".padEn.. 2022. 11. 17. padStart 메서드는 주어진 길이에 맞게 앞 문자열을 채우고, 새로운 문자열을 반환합니다. Reference/Javascript padStart() 메서드는 주어진 길이에 맞게 앞 문자열을 채우고, 새로운 문자열을 반환합니다. by @webs 2022. 11. 10. padStart() padStart() 메서드는 주어진 길이에 맞게 앞 문자열을 채우고, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.padStart() 버전(version) ES8 결과값(return) 문자열(string) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".padStart(길이) "문자열".padStart(길이, 문자열) "456".padStart(1, '0'); //456 "456".padStart(4, '0'); //0456 "456".padStart(5, '0'); /.. 2022. 11. 17. repeat 메서드는 주어진 횟수만큼 반복 복사하여, 새로운 문자열을 반환합니다. Reference/Javascript repeat() 메서드는 주어진 횟수만큼 반복 복사하여, 새로운 문자열을 반환합니다. by @webs 2022. 11. 10. repeat() repeat() 메서드는 주어진 횟수만큼 반복 복사하여, 새로운 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.repeat() 버전(version) ES6 결과값(return) 배열(Array) 사용성 ★★☆☆☆ 문법(Syntax) "문자열".repeat(숫자) "javascript reference".repeat(0); //'' "javascript reference".repeat(1); //javascript reference "javascript reference".repeat(2); //.. 2022. 11. 17. replaceAll 메서드는 특정 문자열을 모두 교체하여, 새로은 문자열을 반환합니다. Reference/Javascript replaceAll 메서드는 특정 문자열을 모두 교체하여, 새로은 문자열을 반환합니다. by @webs 2022. 11. 14. replace() replaceAll() 메서드는 특정 문자열을 모두 교체하여, 새로은 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.replaceAll() 버전(version) ES1 결과값(return) 배열(Array) 사용성 ★★★☆☆ 문법(Syntax) "문자열".replaceAll(찾을 문자열) "문자열".replaceAll(찾을 문자열, 변경할 문자열) "문자열".replaceAll(정규식) "문자열".replaceAll(정규식, 변경할 문자열) "javascript reference".repla.. 2022. 11. 14. replace 메서드는 특정 문자열을 교체하여, 새로은 문자열을 반환합니다. Reference/Javascript replace 메서드는 특정 문자열을 교체하여, 새로은 문자열을 반환합니다. by @webs 2022. 11. 10. replace() replace() 메서드는 특정 문자열을 교체하여, 새로은 문자열을 반환합니다. 특징 설명 유형(type) String.prototype.replace() 버전(version) ES1 결과값(return) 배열(Array) 사용성 ★★★☆☆ 문법(Syntax) "문자열".replace(찾을 문자열) "문자열".replace(찾을 문자열, 변경할 문자열) "문자열".replace(정규식) "문자열".replace(정규식, 변경할 문자열) "javascript reference".replace('javascript', '자바스크립트') .. 2022. 11. 14. 이전 1 2 다음