일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- pug
- javscript
- MongoDB
- TypeScript
- ES6
- Flutter
- clonecoding
- JavaScript
- DART
- Session
- frontend
- node.js
- 자바스크립트
- form
- nodejs
- ECMAScript
- Mongoose
- Component
- react
- heroku
- HTML
- 리액트
- backend
- graphQL
- CLONE
- CSS
- API
- GRID
- NextJs
- express
- Today
- Total
목록JavaScript/Vanilla Js (53)
Enjoy Programming
이번엔 rest와 spread , destructure를 이용해서 예제를 살펴보자. 먼저 user라는 오브젝트를 하나 만들고 prop중 하나를 제거 해보자 password를 null로 만들어줬다. 원하는 것은 이게 아니라 password라는 prop을 아에 제거하는 것이다. 함수를 만들어보자 destructure와 rest를 이용해서 password를 제외한 rest만 return해주는 함수이다 정확히 password를 exclude하고 나머지 rest props 만 가져와서 출력해준다. 이번에도 rest와 destructure를 이용해 default value를 설정하고 prop을 추가해주는 function을 만들어준다. prop이 추가되었고 default로 korea를 넣어준다. 멋지다. 여러 코드를..
자 언제나 그랬듯 mdn을 살펴보자 Rest파라미터 구문은 정해지지 않은 수(an indefinite number, 부정수) 인수를 배열로 나타낼 수 있게 합니다. 언제나 그랬듯 뭔말이냐... 자 보면 ...을 붙여 spread를 사용해주고 theArgs에 1,2,3이라는 인수를 넣으면 자동으로 separate되고 순차적으로 previous, current에 들어가고 그리고서 앞서 들어간 인수들을 합치고 합친결과를 그다음 인수랑 합쳐주고 또 그결과를 마지막 인수와 합쳐준건가? 그래야 맞긴하다. 설명을 더 보면 함수의 마지막 파라미터의 앞에 ... 을 붙여 모든 나머지 인수를 표준 자바스크립트 배열로 대체한다. 마지막 파라미터만 rest파라미터가 될 수있다. 뭔말이야.. help me nomad! 니코쌤은..
먼저 spread를 알아보겠다. spread연산자는 전개구문으로 ... 점 세개를 사용해서 사용가능하다. mdn에 따르면 전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수(함수로 호출할 경우) 또는 요소(배열 리터럴)로 확장하여, 0개 이상의 키-값의 쌍의 객체로 확장시킬 수 있다. 음 뭔소리야 쉽게 생각해 이렇다.. 그냥 콘솔에 찍어보면 저 배열 그대로 배열임을 나타내지만 spread는 배열을 나타내는 []를 표시 하지 않고 풀어 헤친다. 왜 풀어 헤치냐고?.. 음 배열 하나 더있다고 생각하고 합쳐보자 짜잔~ 하나의 배열로 합쳐졌다. 꽤 좋은듯 하다.! 물론 concat()이라는 함수도 있으나~ 이방법도 괜찮은듯 하다~ 그리고 object에도 똑같이 사용가능하다~! 두 ..
자 이번에 다룰 ES6는 destructuring(비구조화)이다. Destructuring이란 구조화된 배열 또는 객체를 비구조화(파괴)하여 개별적인 변수에 할당하는 것이다. 배열 또는 객체 리터럴에서 필요한 값만을 추출하여 변수에 할당하거나 반환할 때 유용하다. 쉽게말해 object나 array같은 구조 안의 요소들을 변수 바깥으로 빼내서 사용할 수 있도록 하는것이다. 먼저 object부터 보자 기존 객체에서 어떤 정보를 빼오려면~ settings.notifications.follow 이런식으로 해야 했다. 그러나 destructuring을 이용하면 value를 추출해 변수에 할당하면 된다. 음 위코드는 default까지 지정한 것이라 좀 헷갈릴 수 있으니 이 코드를 보면 더 이해가 쉽다. 아주 코드가..
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/find Array.prototype.find() - JavaScript | MDN find() 메서드는 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환합니다. 그런 요소가 없다면 undefined를 반환합니다. developer.mozilla.org 1. Array.find() 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환한다. 그런 요소가 없으면 undefined를 반환. 자 예를 들어보자 frineds라는 배열이있고 find()함수를 통해 @gmail이 있는 요소를 찾으려고한다 argument에 @gmail이 있는지 includes메소..
array method에 대하여 알아보자. 1. Array.of() https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/of Array.of() - JavaScript | MDN Array.of() 메서드는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새 Array 인스턴스를 만듭니다. developer.mozilla.org Array.of() 메서드는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새Array 인스턴스를 만든다. 이러한 차이가 있다고 한다~~!~!~ 2. Array.from() https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference..