
안녕하세요. 동기 여러분! 오늘은 중첩 객체(Nested Objects)에 대해 알아봅시다. 조금 복잡할 수 도 있지만 한번 알아 놓으면 두고두고 써먹을 수 있기 때문에 한번 빡세게 배워봅시다 갑시다! Nested Objects // JavaScript let object1 = { key1 : value1 key2 : { key21 : value21, key22 : value22, key23 : value23 } }; 위 코드를 보면 object1에 키값이 두개가 들어가 있는데 key2에서 중괄호를 한번 더 써서 그 안에서 key21, key22, key23라는 키값을 또 만들어주고 그에 응하는 value값을 넣어줄 수 있습니다. 이게 바로 중첩 객체(Nested Objects)입니다. 예제 디아블로2의..

안녕하세요. 동기 여러분! 오늘은 메서드에 대해 정리를 해보도록 하겠습니다. 날씨가 점점 쌀쌀해지고 있는데 다들 옷을 따뜻하게 입으시고 피트니스 센터로 가서 운동 개 빡세게 조지세요! 아 운동 개 좋아 Method 데이터(Data)를 객체(Object)에 담으면 그것이 함수(Function)가 되는데, 우리는 그걸 메서드(Method)라 부릅니다. 객체(Object)안에서 정해진 값을 프로퍼티(Property)라고 하는데 이는 작동 내용을 포함하는 의미이기도 하다. 생김새 // JavaScript console.log(); 오잉? 이건 출력문이 아니던가. 그렇다 console은 객체(Object)였던 것이다. log는 프로퍼티(Property)의 Key 값이었던 것이다. Method 만드는 방법 1 //..

안녕하세요. 동기 여러분! 오늘은 Object안에 선언된 Properties의 값(Key, Value)을 바꾸고 지우고 새로 만드는 방법에 대해 알아봅시다. 갑시다! Property Assignment Property 새로 추가하기 // JavaScript let macaron = { from : '이탈리아', '유명해진곳' : '프랑스', '들여온 사람' : '카트린 드 메디시스', '주 재료' : '계란 흰자, 설탕, 아몬드 가루', '제조 난이도' : '페이스트리의 끝판왕' }; macaron.price = '보통 개당 2000원이 넘음'; macaron['맛'] = '첨가물에 따라 다양한 맛이 있음'; console.log(macaron); /* 출력 : { from: '이탈리아', '유명해진곳'..

안녕하세요. 동기 여러분! 오늘은 지난 시간에 이어 Properties에 접근하여 Key로 Value를 부르는 두 번째 시간입니다. Python과도 많이 비슷하여 아마 두 가지 모두 쉽게 터득하실 수 있을 겁니다. 그럼 갑시다! Bracket Notation Bracket Notation은 [ ] 대괄호 표기법을 사용하여 Key의 Value를 불러내는 방법입니다. 반드시 대괄호 표기법을 사용해야 하는 경우 Key 값이 숫자일 때 Key 값에 띄워쓰기가 있을 때 Key 값에 특수기호가 있을 때 예제 충무공 이순신 장군에 대한 OBJECT입니다. 11번째 줄부터 13번째 줄 까지는 우리가 배운 대로 잘 출력이 되어 나옵니다. 14번째 줄을 보면 숫자는 ' ' (Quotation marks) 없이 대괄호 안에..

안녕하세요. 동기 여러분! 오늘은 Properties에 접근하여 Key 값으로 Value를 데려오는 아주 기가 막히고 쉬운 방법에 대해 알아봅시다! Accessing Properties Properties에 있는 Key를 불러내서 Value를 등장시킬 수 있는데요, 점 표기법(Dot notation)을 사용합니다. 생김새 겸 예제 // JavaScript let theGreatKingSejong = { name : '이도', nationality : '조선', job : '조선의 왕', birth : 1397 }; console.log(theGreatKingSejong.name); console.log(theGreatKingSejong.nationality); console.log(theGreatKing..

안녕하세요. 동기 여러분! 오늘은 객체를 생성하는 방법에 대해 알아보겠습니다. 파이썬에서는 이와 비슷한 사전(Dictionary) 기능이 있는데요, 함께 비교해보며 가봅시다! Creating Object Literals 객체는 자바스크립트의 다른 데이터 타입들처럼 변수로 선언될 수 있습니다. 다만 선언할 때 {}(Curly braces) 중괄호를 사용하여 정해줍니다. // JavaScript let dongiCoding = {}; // 객체가 비어있는 상태 저기 중괄호 안을 채워 줄 수 가 있는데, 바로 Key와 Value로 채워줄 수 있습니다. Key는 Value를 붙잡고 있는 Value의 이름이라고 생각할 수 있습니다. 그 이유는 Key를 통해 Value의 값을 불러올 수 있기 때문인데요 어떻게 생겼..

안녕하세요. 동기 여러분! 오늘은 .some() 메서드와 .every()메서드를 가지고 왔습니다! .some(), .every() Method .some() Method .some() 메서드는 배열(Array)안에 있는 객체(Element)를 하나하나씩 검사하여 우리가 적어 놓은 조건에 맞는 객체를 찾아내면 불린(Boolean) 형태인 true로 알려주는 아주 귀엽고 깜찍한 녀석입니다. 찾아내는 즉시 알려주기 때문에 조건에 맞는 객체가 몇 개인지는 알지 못하고 만약 찾지 못한 경우는 false로 반환해줍니다. .every() Method .every 메서드도 배열(Array)안에 있는 객체(Element)를 하나하나씩 검사하지만(여기서 부터 .some Method랑 다름) 우리가 적어 놓은 조건에 맞는 ..

안녕하세요. 동기 여러분! 오늘은 .reduce() 메서드에 대해 알아보도록 하겠습니다. 문과 출신에 요리가 직업이었던 저에겐 상당히 이해하기 어려운... 메서드였습니다. 문과의 입장에서 쉽게 풀어보겠습니다! The .reduce() Method .reduce() 메서드는 리턴한 결괏값을 하나의 값으로 줄여줍니다. 무엇을 줄여줄까요? 우리가 만든 배열의 객체를 하나의 값으로 줄여줍니다. 생김새 // JavaScript const numbers = [1, 2, 3, 4, 5]; const initialValue = 0; const summedNums = numbers.reduce((accumulator, currentValue, index) => { return accumulator + currentVal..

안녕하세요. 동기 여러분! 오늘은 .findIndex() 메서드에 대해 알아보겠습니다. The .findIndex() Method 객체(element)의 위치를 찾고 싶을 때, 우리는 .findIndex() 메서드를 사용하여 쉽게 찾아낼 수 있습니다. 물론 메서드 이름이 findIndex이니까 우리가 찾고 싶은 객체를 컴퓨터가 인덱스 번호로 알려줍니다. 하지만 우리가 걸어놓은 조건에 만족한 객체를 찾지 못한다면, 컴퓨터는 -1로 값을 알려주는데요, 이는 false라는 뜻으로 볼 수 있습니다. 생김새 // JavaScript const nums = [1, 2, 3, 4, 5, 6]; const largerThanFourNum = nums.findIndex(num => { return num > 4; });..

안녕하세요. 동기 여러분! 오늘은 .filter() 메서드를 가지고 왔습니다. The .filter() Method filter를 영어사전에 찾아보면, 필터, 여과 장치, 여과하다, 거르다 라는 뜻이 있습니다. 그러므로 .filter() 메서드는 배열에 있는 객체를 우리가 정한 코드에 따라 걸러주는 아주 귀엽고 깜찍한 친구가 되겠습니다. 또한, 저번 시간에 알아본 .map() 메서드처럼 새로운 배열을 만들어 줍니다. 생김새 // JavaScript const straightNumbers = [1, 2, 3, 4, 5]; // 배열 const oneTwoThree = straightNumbers.filter(straightNumber => { // .filter() 메서드 적용 return straight..
- Total
- Today
- Yesterday
- Array
- Type
- html table
- Python
- method
- 타입 좁히기
- 동기코딩
- em
- CSS 포지션
- Typescript
- 객체
- html
- HTML 기본
- 함수
- for문
- if문
- Margin
- 프로그래머스
- 자바스크립트
- 반복문
- 메서드
- padding
- 타입스크립트
- Object
- 파이썬
- CSS
- 실수
- css position
- javascript
- function
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |