JavaScript(12)
-
rest parameter, arguments, spread 연산자
* rest parameter - 전달되는 매개변수의 숫자를 알 수 없을 경우 사용 - 함수의 마지막 파라미터 앞에 ...를 붙여 전달된 인수들을 배열로 전달받음 function foo(...rest) { console.log(rest); } foo(0, 1, 2, 3, 4); // result: [0, 1, 2, 3, 4] - rest 파라미터는 반드시 마지막 파라미터여야 함 function foo(a, b, ...rest) { console.log(rest); } foo(0, 1, 2, 3, 4); // result: [2, 3, 4] function bar(...rest, a, b) { console.log(rest); } // Uncaught SyntaxError: Rest parameter mu..
2020.03.03 -
template 태그 & fragment
* HTML 요소 - 페이지를 불러오고 바로 화면에 표시되지는 않음 - 안에 담긴 HTML 코드를 JavaScript를 이용해 인스턴스로 생성할 수 있음 - 템플릿이 담고 있는 DOM 하위 트리를 나타내는 DocumentFragment인 content 속성을 가짐 - template 태그의 예시 좋아요 - 위의 예시에서 li에 접근하기 위해서는 template -> content -> children[0] 으로 접근 - children이 HTMLCollection의 유사배열 형태이기 때문에 인덱스를 적어줘야 함 - username에 접근하기 위해서는 template -> content -> children[0] -> children[0] 으로 접근 - template 태그 안에 작성된 HTML 코드를 화..
2020.03.01 -
split, slice, substring
String.prototype.split(구분자) [immutable] - 문자열을 지정된 구분자로 여러 개의 문자열로 나눔 - csv파일을 다룰 때 유용 - 빈 문자열이 주어졌을 경우 빈 문자열을 포함한 배열 반환 - 문자열, 구분자 모두 빈 문자열일 경우 빈 배열 반환 - 반환값: 끊어진 문자열을 담은 배열 const str1 = 'Now you gonna take me there'; str1.split(' '); //result: ["Now", "you", "gonna", "take", "me", "there"] const str2 = '010-1234-5678'; str2.split('-'); //result: ["010", "1234", "5678"] str2.split(''); //result..
2020.02.15 -
concat, indexOf, includes
Array, String method의 immutable - method 사용했을 때 원본 Array, String이 변하지 않으면 immutable, 변하면 mutable - string method는 전부 immutable - array method의 경우는 method에 따라 다름 Array.prototype.concat( ) [immutable] String.prototype.concat( ) [immutable] - 인자로 전달받은 배열을 기존 배열에 합쳐서 새 배열 반환 - 기존 배열을 변경하지 않음 - 반환값: 합쳐진 새로운 배열 / (문자열일 경우) 문자열 const arr1 = ['HTML', 'CSS', 'JavaScript']; const arr2 = ['Python', 'Java',..
2020.02.15 -
object의 메소드
1. Object.assign( ) - 원본 객체로부터 대상 객체로 속성과 값을 복사 - 형태: Object.assign(대상 객체, 원본 객체); - 원본 객체는 여러 개가 들어갈 수 있음 - 원본 객체의 경우 뒤쪽에 있는 객체가 앞쪽의 객체를 덮어씀 let o1 = { a: 1, b: 2, c: 3 }; let o2 = { b: 4, c: 5, d: 6 }; let obj = {}; Object.assign(obj, o1, o2); //result: { a: 1, b: 4, c: 5, d: 6 }; //대상 객체가 o1, o2 두개 //뒤에 있는 o2가 o1을 덮어씌운 뒤의 결과를 obj에 복사 2. Object.keys( ) - 객체의 프로퍼티명을 복사해 배열로 반환 - 형태: Object.keys..
2020.02.14 -
Object의 Dot Notation & Bracket Notation, 연산자
Object의 속성에 접근하는 방법 1. Dot Notation let fruit = { name: 'apple', color: 'red', healthy: true }; fruit.name; // result: 'apple' - object.property 의 형태로 사용 - key값이 동적으로 변할 때 사용에 한계가 있음 2. Bracket Notaion let fruit = { name: 'apple', color: 'red', healthy: true }; fruit['name']; // result: 'apple' - object.['property'] 의 형태로 사용 - key 값이 변수일 때 주로 사용 3. Dot Notation, Bracket Notation 을 이용해 값 추가하기 let..
2020.02.14