Dongi_coding 동기_코딩

안녕하세요. 동기 여러분! 오늘은 객체(Object)에서 반복문을 뽑아오는 방법에 대해 알아봅시다. 쓰임이 참 많은 친구이기 때문에 제대로 알아봅시다. Looping Through Objects 우리가 걸어놓은 조건을 통해 반복문은 계속 실행이 되는데 이걸 배열(Array)에서 쓰는 방법을 알아봤었습니다. 혹시 기억이 안 나 시는 분은 이쪽으로 -> https://dongi-coding.tistory.com/37 [JavaScript] Looping through Arrays 안녕하세요. 동기 여러분! 오늘은 반복문을 배열(Array)과 함께 쓰는 방법을 알아보겠습니다! 파이썬에도 비슷한 기능이 있으니 비교해봅시다. Looping through Arrays 반복문을 이용해서 배열에 있는 dongi-cod..

안녕하세요. 동기 여러분! 오늘은 중첩 객체(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의..

안녕하세요. 동기 여러분! 오늘은 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..

안녕하세요. 동기 여러분! 오늘은 .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..

안녕하세요. 동기 여러분! 오늘은 Function Expressions를 배워볼 거예요! Function Expressions 함수를 정의하는 다른 방법도 있는데요, 변수(Variable)에 함수를 저장해 두고 쓰는 방법입니다. 코드로 바로 확인해 볼까요? const jellyCount = function(children, amount) { const total = children * amount; return total; }; 변수(Variable) jellyCount를 쓰고 그 안에 함수를 정의하는 function 키워드를 이용해 소괄호(Parentheses)에 매개변수(Parameter) (children, amount)를 넣는다. 매개변수(Parameter) 각각을 곱해 total에 넣어준다. t..

안녕하세요. 동기 여러분! 오늘도 파이썬과 함께 비교해보는 시간을 갖도록 하겠습니다. Helper Functions Helper Functions는 코드를 읽기 쉽게 하고 디버깅하기 편하게 만들어주는 기능(?)인데요, 이 친구들은 다른 함수 안에 들어가서 사용되고 있는 함수로써 'Helper Functions'라고 부릅니다. 말 그대로 도와주는 애들이죠. 예를 들어 젤리를 먹고 싶은 아이들이 있습니다. 몇 명(children)인지 세어보고 몇 개(amount)나 먹고 싶은지 물어보고 개당 100원인 젤리의 총가격을 알아보는 코드를 적어보겠습니다. 그리고 아이들이 10명, 한 명당 6개씩 먹고 싶은 걸로 가정해보겠습니다. 위에 첨부된 코드를 보시면 : jellyCount라는 함수를 만들고 매개변수(para..

오늘은 쉽지만 놓칠 수도 있는 내용 Return을 가지고 왔습니다. 오늘도 역시 파이썬과 함께 비교해봅시다! Return 사전에 Return을 찾아보면, 돌아오다, 돌려주다, 반납하다 등등이 있는데요, 여기서는 돌려줘라 라고 해석하면 가장 자연스럽습니다. 간단한 예를 들어보겠습니다. 통장 잔고를 알려주는 함수를 만들 텐데 통장 총액에서 사용한 금액을 차감하는 형태의 코그입니다. 만원을 가지고 있는데 2500원짜리 야채김밥을 사 먹었다고 계산해보겠습니다. accountTotal이라는 함수에 total, spend라는 매개변수(parameter)를 넣고 return을 써주어 '값을 돌려줘라'라고 명령도 넣고 total - spend를 한 후에 식별자(Identifier)인 acountTotal로 실행을 시키..