본문 바로가기

전체 글521

43. Default Parameters, Reference Arguments In Function 안녕하세요. 박기린 입니다. 이번엔 함수의 '인수'에 관련된 내용인 '기본값'과 'Reference type'에 대해 알아보겠습니다. Default Parameters ES6 부터는 함수의 인수 옆에 '= (할당연산자)'를 붙인 후, expression을 넣어주면 default value(기본값)으로 설정됩니다. const bookings = []; const createBooking = function(flightNum, numPassengers = 1, price = 199 * numPassengers) { // ES5 방식 // numPassengers = numPassengers || 1; // price = price || 199; const booking = { flightNum, numPas.. 2022. 11. 25.
42-2. String 내장 메소드를 응용해보기 안녕하세요. 박기린 입니다. 저번 글에 이어서 String 내장 메소드에 대해 더 깊이 알아보겠습니다. (꼭 'https://arnopark.tistory.com/534' 이 글을 읽은 후에 본문을 읽어주시길 바랍니다.) Split and Join String의 문자들을 분리해서 Array에 저장하거나, Array에 따로 담겨진 String을 하나로 이어줄 수 있습니다. Split console.log('a+very+nice+string'.split('+')); // [a, very, nice, string] console.log('giraffe Park'.split(' ')); String.prototype.split('나누고자 하는 String') : String을 '나누고자 하는 String'을 기.. 2022. 11. 23.
42. String 내장 메소드를 응용해보기 안녕하세요. 박기린 입니다. 이번엔 String 내장 메소드를 응용한 사례들을 소개해드리겠습니다. Fix capitalization in name const passenger = 'GiraFFE'; const passengerLower = passenger.toLowerCase(); // 모두 소문자로 const passengerCorrect = passengerLower[0].toUpperCase() + passengerLower.slice(1); // 첫 글자만 대문자로 console.log(passengerCorrect); // Giraffe 대문자, 소문자가 섞인 이름을 첫 글자만 대문자인 이름으로 바꿔주는 코드입니다. String.prototype.toLowerCase() : 모든 글자를 소문자.. 2022. 11. 22.
[우마무스메 - 뽑기] 수영복 마루젠스키 획득 & 첫 육성 온천 안녕하세요. 박기린 입니다. 카카오게임즈 논란으로 우마무스메를 접었다가, 최근 카카오게임즈가 변했다는 소식과 수루젠(수영복 마루젠스키)가 픽업 출시되었다는 소식을 듣고, 오랜만에 접속을 해서 가챠를 돌렸습니다. 수루젠 뽑기(가챠) 한 겨울에... 여름을 언급하면서 등장한 수영복을 입은 마루젠스키.. 뭔가 현실과는 동떨어져 있지만, 그래도 뽑으니 기분이 좋습니다. 뽑을 때는 '나리타 브라이언'이 픽뚫로 나왔었습니다. 수루젠은 우마무스메 뽑기 가챠권 7장 + 무료주얼 80연차 만에 나왔습니다. 명함만 얻는 것이 원래 계획이었어서, 추가 가챠는 안 할 예정입니다. 수루젠 시나리오 정보 수루젠은 잔디, 도주에 인자만 잘 받아준다면 단거리부터 장거리까지 전부 뛸 수 있는 엄청난 우마무스메입니다. 저는 부족한 단거.. 2022. 11. 20.
[모동숲 섬꾸 - 야외] 패션 부티크 (옷가게/백화점 매장) 안녕하세요. 박기린 입니다. 고오급 레스토랑에 이어서, 고오급 옷 가게 '패션 부티크'를 소개해드리겠습니다. 패션 부티크 바로 이곳입니다. 성벽 아치와 울타리, 마이디자인 바닥 타일을 이용해서 백화점 명품 매장의 분위기를 어떻게든 내보려고 노력한 모습입니다. 야외이다보니, 최대한 섬 이동 동선에 꼬이지 않도록 만들 필요가 있었습니다. 그래서 벽을 울타리로 막은 게 아니라, 아치를 이용해서 옆문으로도 들어올 수 있게 만들었습니다. 옷가게 내부 동선도 원활하게 끔, 부지를 넓게 책정해서 건설하였습니다. 야외에서 옷가게를 따로 만드는 일이 쉽지는 않았습니다. 어떤 가구와 울타리로 벽을 세울지, 어떤 마이디자인으로 바닥을 깔아서 좋은 분위기를 낼지, 옷은 어떻게 진열을 할지 고민이 많았습니다. 초기 버전의 모동.. 2022. 11. 19.
41. Looping Objects: Object Keys, Values, and Entries 안녕하세요. 박기린 입니다. 지금부터 Object 예약어를 이용해서 Object loop를 만드는 방법에 대해 알아보겠습니다. const openingHours = { thu: { open: 12, close: 22, }, fri: { open: 11, close: 23, }, sat: { open: 0, // Open 24 hours close: 24, }, }; 우선 openingHours 라는 객체가 있다고 가정을 하고 설명을 시작하겠습니다. Object.Keys() - names of properties Object.Keys()안에 인수로 Object 변수를 넣습니다. 그러면 해당 Object가 가진 property의 이름들을 Array에 담아서 return 합니다. const properties.. 2022. 11. 19.
40. Optional Chaining (?.) 안녕하세요. 박기린 입니다. 이번엔 Optional Chaining(옵셔널 체이닝)에 대해 알아보겠습니다. Optional Chaining의 탄생 비화 in ES2020 const openingHours = { thu: { open: 12, close: 22, }, fri: { open: 11, close: 23, }, sat: { open: 0, // Open 24 hours close: 24, }, }; 우선 위와 같은 객체가 있다고 가정을 합니다. 하지만 개발자는 이 객체의 정확한 정보를 모르기 때문에, 월요일부터 일요일까지 중에 어떤 요일이 있고 없는 지에 대해 모릅니다. 개발자는 서버에 당연히 월요일에 대한 정보가 있을 거라고 생각하고, console.log(openingHours.mon.ope.. 2022. 11. 16.
39. ES6 버전의 Enhanced Object Literals 안녕하세요. 박기린 입니다. 이번에는 자바스크립트가 ES6이 되면서 추가된 Obejct Literals (객체 리터럴)의 편리한 기능들에 대해 알아보겠습니다. Enhanced JavaScript 자바스크립트는 버전 업데이트를 지원하고 있습니다. 새로운 버전은 '코딩 작성 트렌드를 따르는 방식'을 업데이트 해주고, 다른 언어에 친숙한 개발자들도 쉽게 자바스크립트를 접할 수 있도록 도와줍니다. ES6 버전의 Object Literal 추가 업데이트 또한 다른 프로그래밍 언어들의 개발트렌드를 반영하여 자바스크립트에 적용시킨 사례입니다. Object Literals in ES6 - Object의 property에 또 다른 Object를 담으려는 경우 레스토랑의 운영 정보를 담아놓은 restaurant라는 Obj.. 2022. 11. 15.
38. for-of로 Array의 Element에 접근하기 안녕하세요. 박기린 입니다. 이번엔 for-of 구문에 대해 알아보겠습니다. for-of 구조 for (const 'array의 요소를 담을 변수' of 'array의 이름') { {...실행코드...} } for-of 구문은 배열의 각 요소에 대해 for문을 이용해서 쉽게 접근할 수 있게 해줍니다. (python의 for-in과 유사합니다.) for-of 예시 const menu = ['pizza', 'chicken', 'salad', 'pasta']; 위와 같은 Array가 있다고 가정을 합시다. for (const item of menu) console.log(item); 여기에 for-of 구문을 사용합니다. item 변수에 Array의 Element를 담은 후에, 실행코드를 실행합니다. 이런식으.. 2022. 11. 14.