공부/TIL-D (65) 썸네일형 리스트형 프로젝트 경험 본인이 지금까지 했던 프로젝트 소개 또는 기억에 남는 프로젝트 및 경험 설명해주세요 프런트 엔드 부분 프로젝트 잔고 어때 바닐라 자바스크립트로 구현 + 크롬 익스텐션을 사용해서 웹사이트에 방문하지 않아도 사용할 수 있게 함 stack : javascript rich boys 프레임워크 사용 + API를 실시간으로 가져와서 화면에 출력 + api 요청을 1분에 60회 요청을 하다 보니 비정상적인 접근이라고 판단 (임시방편으로 요청 횟수를 줄였는데, 어떻게 해결할지 고민) stack : angular airbnb clone 백엔드 + 프런트엔드 + ios 팀 프로젝트를 하였고, 백엔드를 공통으로 두되 ios와 프런트가 데이터를 가져와서 화면을 구성하는 일을 하다 보니 서로의 니즈가 달라지는 사건이 발생 협업.. 클로저란? 목적 : 면접 때 질문받은 클로저에 대한 이해 실행 컨택스트에 대한 지식이 존재한다면, 이해될 수밖에 없는 개념 클로저 정의 : " 함수와 그 함수가 선언된 렉시컬 환경의 조합 " 함수란 단어가 2번이나 나왔듯 자바스크립트 외에도 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 접할 수 있는 개념입니다. 예제 코드를 통한 이해를 하도록 해보겠습니다. const x = 1; function outerFunc() { const x = 10; function innerFunc() { console.log(x); // 10 } innerFunc(); } outerFunc(); 코드에서 실행 콘텍스트의 관점으로 봤을 때 outerfunc가 먼저 호출되고, 뒤에 innerfunc가 호출됩니다. [실행 콘텍스.. 프로미스 프로미스는 자바스크립트에서 비동기 처리를 위한 패턴입니다. 최초 자바스크립트는 비동기 처리를 위해 콜백 패턴을 이용하였습니다. 문제점으로 가독성이 나쁘고, 비동기 처리 중 에러 처리가 어려우며 여러 개의 비동기 처리가 어려웠습니다. 콜백 헬이라는 문제도 발생하였지만, 가장 큰 문제점은 에러 처리의 한계가 있다는 점으로 느껴집니다. ES6에서 비동기 처리를 위한 프로미스 패턴이 도입되었습니다. // 프로미스 생성 const promise = new Promise((resolve, reject) => { // Promise 함수의 콜백 함수 내부에서 비동기 처리를 수행한다. if (/* 비동기 처리 성공 */) { resolve('result'); } else { /* 비동기 처리 실패 */ reject('.. [JS]프로토타입 자바스크립트는 명령형, 함수형, 프로토타입 기반의 객체지향 프로그래밍 언어입니다. 대표적인 차이인 클래스 기반의 객체지향 프로그래밍과 다르게 '프로토타입' 기반의 객체지향 프로그래밍이며 자바스크립트를 이루고 있는 모든 것은 거의 객체입니다. 객체지향 프로그래밍이란, 실세계의 실체를 속성을 통해 인식하거나 구별하는 철학적인 사고를 프로그래밍에 접목하였습니다. 특정한 속성을 추상화하여 필요한 속성만을 찾아냅니다. 객체는 상태 와 동작을 논리적인 단위로 묶는 자료구조입니다. 객체지향 프로그래밍의 장점이자 특징 중 하나인 상속은 프로퍼티, 또는 메서드를 다른 객체가 받아서 사용할 수 있는 것입니다. 프로토타입 객체를 통해 상속을 구현하며 프로토타입이란, 어떠한 객체의 '부모'(상위) 객체 역할을 하는 객체입니다.. 배열안의 원소의 합을 반복문을 사용하지 않고 구하기 const array = [1,2,3,4,5,6,7,8,9,10] 1~10까지의 연속된 숫자가 존재한다고 가정합니다. array의 합은 몇일까요? const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; function arraySum(array) { let sum = 0; for (let i = 0; i (su.. Cold observalbe Hot observable Cold observable 옵저버블은 구독하기 전까지는 동작하지 x -> 이런특성을 Cold observable RxJs 옵저버블은 기본적으로 Cold observable Cold observable을 옵저버가 구독하면 ,처음부터 동작하기 시작 -> 그후 방출하는 모든 데이터 스트림 받을 수 있음 옵저버블을 구독하는 옵저버는 하나 ↑ 시점상관 x 모든 데이터를 빠짐없이 받음 -모든 옵저버는 자신만을 위해 독립적으로 실행하는 옵저버블 갖음 (유니 캐스트) Hot observable 구독과 상관x 데이터 스트림 방출 시간경과해서 옵저버블 구독하면 앞부분 구독 x 중간부분부터 구독 Subject를 옵저버블이면서 옵저버, 모든 옵저버에게 부수 효과가 있다. - 멀티 캐스트 유니캐스트 vs 멀티캐스트 일대일 v.. 생명주기 컴포넌트 , 디렉티브는 생명주기를 가짐. 생명주기란 컴포넌트와 디렉티브가 생성되고 소멸되는 여러 과정. angular는 생명주기를 기반, 생명주기 훅 메소드를 구현해야함 생명주기 메소드는 인터페이스 형태 (가장흔한게 OnInit) 단 OnInit은 추상메소드 생명주기는 동일한 이름의 인터페이스가 존재 ng 접두어를 붙혀 추상메소드를 구현 컴포넌트 ,디렉티브도 클래스 -> 컨스트럭터의 호출에 의해 생성 -> Angular는 특별한 시점에 구현된 생명주기 훅 메소드 호출 )ngOnChange -> 부모, 자식 입력프로퍼티로 바인딩한 값이 초기화 또는 변경되었을 때, 실행 컴포넌트에 입력프로퍼티가 없다 -> 호출필요 xx ngOnit 전에 입력프로퍼티 존재, 최소 1회호출, 원시타입값 재할당, 객체의 참조가 .. scroll 복습 scroll 복습 중요한것 window의 객체다 window.pageYoffset console.log(window.pageYoffset)하면 계속 0이다. scroll이라는 이벤트는 윈도우가 발생시킨다 제일익숙한 버튼이벤트는 버튼이 발생시킨다 window.onscroll. = function () { 함수정의 } window.onscroll. = function () { } window.scrollTo() 인수 x좌표 y좌표 widnwo scroll차이 인수 = 객체 객체에 '세개'가 들어감 angular scroll은 '디렉티브'를 해보기 위함이였음 @HostListener()을 사용해야함 데코레이터(이벤트내용) 이벤트핸들러(){ } 이전 1 2 3 4 ··· 9 다음
배열안의 원소의 합을 반복문을 사용하지 않고 구하기
const array = [1,2,3,4,5,6,7,8,9,10] 1~10까지의 연속된 숫자가 존재한다고 가정합니다. array의 합은 몇일까요? const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; function arraySum(array) { let sum = 0; for (let i = 0; i (su..
