taenyLog

Properties & Methods textContent 모든 요소 반환한다. 마크업에서 온 것. 현재 나타난 내용이나 사용자에게 보이는 내용은 신경쓰지 않는다. innerText는 사용자가 보이는 내용이 나온다. 객체의 모든 특성과 같은 값도 검색할 수 있다. 현재 보이는 내용에 따라 달라진다. 내부 텍스트 반환하므로 태그는 모두 무시되고 현재 표시된 내용에 따라 달라지고 숨겨진 항목은 무시. innerHTML 특정 요소에 포함된 마크업의 전체 내용을 출력. 여는태그, 닫는태그 등 셋다 콘텐츠를 설정하거나 업데이트 하는데 쓸 수 있다. innerHTML만 다른 요소안에 추가할 때 쓸 수 있다.

순서를 따르지 않는다. 배열 구조 분해보다 실용적임. 사용자 정보 중 몇가지 특성에 접근하거나 선정해야 하는 경우 유용 // 예제 객체 const person = { firstName: 'John', lastName: 'Doe', age: 30, city: 'New York' }; // 객체 분해 const { firstName, lastName, age, city } = person; // 분해한 값 출력 console.log('나이:', age); console.log('도시:', city); console.log('이름:', firstName); console.log('성:', lastName); // 변수 이름 변경 const {city : country} = person; > country < ..

REST - Available inside every function - It's an array-like object > Has a length property > Does not have array methods like push/pop - Contains all the arguments passed to the function - Not available inside of arrow function REST PARAMS Collects all remaing arguments into an actual array 나머지 연산자는 점 세 개로 만들고 매개변수 목록에 들어간다. 남아 있는 인수를 모두 모으고 배열로 나타낸다. function raceResults(gold, silver, ...everyo..

Copies properties from one object into another object literal 객체에 있는 특성을 복사해서 새로운 객체를 만든다. 객체 여러 개를 한 객체로 묶거나 기존의 객체를 이용해서 객체를 새롭게 만들 수 있다. 객체를 복사하거나 수정 할 수 있다 충돌시 마지막으로 온 값이 이전의 값을 덮는다. 왜 전개를 사용할까 ? 왜 새로운 객체를 만들까 ? 객체를 복사할 때 우리는 전개를 사용해서 펼친다. const dataFromForm = { email :'zzz@gmail.com', password: 'qwe123', username: 'newbie' } const newUser = {...dataFromForm, id :123, isAdmin:false } 사용자가 웹사..

In Array Literals Create a new array using an existing array. Spreads the elements from one array into a new array. 반복 가능한 객체를 어떻게 펼치는가 ? 배열을 복사해서 쓴다. const fruits = ['apple', 'banana']; const vegetables = ['cucumber','lettuce','cabbage']; const allGroceries = [...fruits, ...vagetabkes] allGroceries 호출시 'apple', 'banana' , 'cucumber','lettuce','cabbage' 가 호출된다. 배열 두개를 묶어서 새로운 배열을 만들었다.

spread : 전개구문 배열과 같이 반복 가능한 객체를 전개 구문을 사용해서 확장한다. 함수로 호출할 경우엔 0개 이상의 인수로 배열 리터럴에서는 요소로 확장할 수 있다. 객체 리터럴의 경우 객체 표현식은 0개 이상 키-값 쌍으로 확장할 수 있다. The spread (...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected. In an object literal, the spread syntax enumerates the propertie..

Default Params function rollDie(numSides) { return Math.floor(Math.random() * numSides) + 1 } numSides에 원하는 주사위 면의 수를 넣으면 랜덤으로 주사위 면의 수에따라 숫자가 나오는 rollDie 함수를 선언 이 상태에서 rollDie()를 입력하면 NaN이 뜬다. 아무것도 입력하지 않았을때 numSides가 6이라고 하는 함수를 작성해보자.. Old Way function rollDie(numSides) { if(numSides === undefined){ numSides = 6 } return Math.floor(Math.random() * numSides) + 1 } New Way function rollDie(numS..

const person = { firstName : 'Taeny', lastName : 'Kim', fullName : function(){ `${this.firstName} ${this.lastName}` } } 여기서 this가 person을 가르키니까 Taeny Kim의 값을 얻을 수 있다. const person = { firstName : 'Taeny', lastName : 'Kim', fullName : function() => { `${this.firstName} ${this.lastName}` } } 화살표 함수 안에 있는 this 키워드는 함수가 만든 범위를 가리킨다. 즉, 윈도우 객체를 가리킨다. const person = { firstName : 'Taeny', lastName : '..