본문 바로가기

분류 전체보기120

20201229 TIL 배운 것들 underbar 문제 풀기 javascript 내장 함수 구현하기 변수 선언 시 약식 분기문에 의한 값 할당 방법 고차 함수 익숙해지기? 조건문에서 함수 존재 여부 찾기 더 알아볼 것 truthy Vs falsy 언더바 _. uniq, _. reduce, _. includes(reduce 활용해서), _. every , _. zip , _. intersection 언더바를 풀면서 js의 내장 함수를 직접 구현하였다. 직접 구현을 하면서 고차 함수와 내장 함수들이 작동하는 방식에 대하여 이해하는데 도움이 되었고 간결한 코드에 중요성을 알게 되었다. 또한 좋은 해결책을 찾지 못하는 경우 머리를 식히는 과정 또한 중요하다는 생각을 하였다. 언더바 문제를 풀면서 공부를 하는데 놓쳤던 작은 부분들 때문.. 2020. 12. 29.
javascript append , prepend append와 prepend는 동적인 웹 개발에 유용하게 쓰일 수 있다. append와 prepend를 사용하여 부모 자식관계를 만들고 이를 이용하여 웹의 형태나 정보를 나타낼 수 있다. append(appendTo)는 새로운 요소를 타깃의 마지막에 추가하고 prepend(prependTo)는 새로운 요소를 타깃의 처음에 추가한다. 쉽게 생각해보면 배열에서의 push와 unshift의 관계라고 생각하면 이해하기 쉽다. const div = document.createElement('div'); // body.append(div); // body.prepend(div); append vs appendTo를 비교하면 단지 타깃과 요소의 위치가 반대인 경우이다. prepend vs prependTo의 경우도 .. 2020. 12. 28.
javascript 고차함수 (filter, map, reduce) 자바스크립트에서는 특별한 대우를 받는 것들이 있다(first class). 이런 것들을 일급 객체(first-class citizen)라고 한다. 그중 하나가 함수(function)이다. 자바스크립트에서 함수는 변수에 할당(assignment)할 수 있다. 다른 함수의 인자(argument)로 전달될 수 있다. 다른 함수의 결과로써 리턴될 수 있다. 이는 함수를 데이터(string, number, boolean, array, object) 다루듯이 다룰 수 있다는 걸 의미한다. 변수에 저장할 수 있기 때문에 배열의 요소나 객체의 속성 값으로 저장하는 것도 가능하다. 함수 표현식에서 함수를 변수에 저장하는 것을 배웠다. 변수에 저장되어 인자로 전달되거나 리턴 값으로 사용될 수 있다는 특징들은 고차 함수를 .. 2020. 12. 27.
javascript 클로저 클로저(closure)는 내부 함수가 외부 함수의 맥락(context)에 접근할 수 있는 것을 가리키는데 클로저의 정의는 함수와 함수가 선언된 어휘적 환경의 조합이다. js에서는 함수를 함수안에 선언할 수 있기에 이러한 조합이 가능하다. function outter(){ let alert = 'hello world'; function inner(){ console.log(alert) } inner(); } outter(); //--> 'hello world' 위처럼 클로저에서는 내부함수가 외부 함수의 지역변수에 접근할 수 있다. (내부 함수에서 지역변수, 외부 함수의 변수, 전역 변수의 접근이 가능하다.) function adder(x){ return function(y){ return x + y; } .. 2020. 12. 27.
javascript 원시, 참조 자료형 고정된 저장 공간을 차지하는 데이터를 원시 타입(primitive type) 데이터라고 한다. 저장공간이 유동적으로 늘어나는 데이터 타입을 주소 타입(reference type) 데이터라고 한다. 자바스크립트에서 원시 타입의 데이터는 객체가 아니면서 method를 가지지 않는 6가지의 타입이다. string, number, bigint, boolean, undefined, symbol, (null) const num1 = 123; const num2 = 123456789; 변수에는 데이터의 크기와는 관계없이 하나의 데이터만 담을 수 있다. 원시 자료형은 값 자체에 대한 변경이 불가능(immutable)하지만, 변수에 다른 데이터를 할당할 수는 있다. 참조 자료형의 데이터는 원시 자료형이 보관되는 데이터 .. 2020. 12. 21.
javascript 객체 자바스크립트에서 객체는 게임 캐릭터에 비유할 수 있다. 게임에서의 캐릭터는 서로 다른 직업과 능력을 가지고 있다. 이처럼 다양한 속성을 가지고 있는 경우에 객체를 사용하여 데이터를 관리하는 것이 바람직하다. 객체는 키와 값의 쌍(key-value pair)으로 구성된 요소를 가지고 있으며 쉼표로 구분하고 {}를 이용하여 만들 수 있다. 또한 배열과 다르게 객체는 순서가 없다. let user = { 'json': 10, 'sangrae': 6, 'juju': 80}; console.log(user[0]) // undefined 객체의 값을 사용하는 방법에는 dot notation과 bracket notation이 있다. console.log(user.json) // 10 dot notation conso.. 2020. 12. 14.
javascript 배열 배열은 순서가 있는 값이다. 순서를 index라고 부르며 1이 아닌 0으로 시작한다. 대괄호를 이용하여 배열을 만들고 index에 따라 요소가 들어가 있으며 쉼표로 구분된다. let myNumber=[13,47,82,91,11,5]; myNumber[3]; // 91 값을 변경하기 위해서는 let myNumber=[13,47,82,91,11,5]; myNumber[3]=100; console.log(myNumber) // [ 13, 47, 82, 100, 11, 5 ] javascript의 특정값이 배열인지에 대한 판단을 하기 위해서는 Array.isArray를 사용하여야 한다. 단순히 typeof를 사용하면 이것은 단지 object를 나타내기 때문이다. 이것은 data type과 관련이 있다.(prim.. 2020. 12. 14.
javascript 반복문 같거나 비슷한 코드를 여러 번 실행할 경우에 반복문을 사용한다. 반복문에는 for,while이 있는데 for반복문은 반복할 내용을 초기식, 조건식, 증감 문 순서로 작성한다. 후에 반복할 내용을 중괄호 block 안에 작성한다. let sum=0; for(let i=1 ; i 2020. 12. 14.
javascript 조건문 조건문은 어떠한 조건을 판별하는 기준을 만드는 것이다. 조건문에는 반드시 비교 연산자(comparison operator)가 들어가야 한다. (>, =,2) // false !undefined // true !"hello" // true 또한 밑의 예시의 경우를 보자 if (false) // false 이므로 실행되지 않음 if (null) // false 이므로 실행되지 않음 if (undefined) // false 이므로 실행되지 않음 if (0) // false 이므로 실행되지 않음 if (NaN) // false 이므로 실행되지 않음 if ('') // false 이므로 실행되지 않음 if ([]) // true 로 실행됨 위부터 6가지의 경우 모두 falsy 한 값으로 실행이 되지 않지만 마지.. 2020. 12. 14.