코드스테이츠(Pre) 썸네일형 리스트형 recursion 코드 예시2 getElementsByClassName var getElementsByClassName = function(className){ // 먼저 인자로 받는 className과 동일한 이름에 class이름을 가진 것을 찾아서 // 그 class이름과 동일한 class를 가진 것들을 빈 배열에 담아보자. var result = []; // 빈배열 생성 function check(elements){ // elements는 class이름을 확인할 장소 ex) div , span 등등 if (elements.classList){ // 그 장소에 class를 가진 게 존재한다면 if (elements.classList.contains(className)){ // 그 클래스에 인자로 받는 className이 있으면 r.. recursion 코드 예시 카운트다운 let countDownFrom = (num) => { if(num===0) return; countDownFrom(num-1) } 팩토리얼 factorial(5) // 120 function factorial(num) { if(num === 1) { return num; // return 1; } return num * factorial(num-1); } console.log(factorial(5)); factorial(5) => 5 * factorial(5 - 1) => 4 * factorial(4 - 1) => 3 * factorial(3 - 1) => 2 * factorial(2 - 1) => 1 => 2 * 1 => 3 * 2 => 4 * 6 => 5 * 24 => 120 https:.. 자바스크립트_객체지향 프로그래밍(OOP) 자바스크립트는 클래스 기반의 언어들과 달리 프로토 타입 기반의 객체 지향 프로그래밍언어(ES6에서는 클래스도 추가) extend 와 프로토타입 체인의 구별 extend의 경우 실제 object의 프로퍼티에 추가 var person = { firstname : 'Default', lastname : 'Default', getFullName : function() { return this.firstname + ' ' + this.lastname; } } var john = { firstname : 'John', lastname : 'Doe' } john.__proto__ = person; // john 객체에서 프로퍼티 메소트 찾은 후 없으면 proto 탐색 for(var prop in john){ if(j.. 자바스크립트_클로저 클로저 : 외부함수가 종료된 뒤에도 내부함수는 외부함수의 execution context가 사용했던 메모리 공간에 접근 가능 클로저의 작동순서 function greet(whattosay){ return function(name){ console.log(whattosay + ' ' +name); } } greet('hi')('tony') // hi tony // greet() 실행이 끝나면 greet() execution context 사라졌지만 var sayHi = greet('hi'); // sayHi()에서 whattosay를 참조! sayHi('tony'); // hi tony 클로저 예제 function buildFunction(){ var arr = []; for(var i = 0; i 자바스크립트_함수, 프로토타입 체이닝 Function Statements greet() // hi function greet(){ console.log('hi'); } Function Expressions : value를 결과로 갖는 코드 a = 3 // 3 1+2; // 3 a = {greeting:'hi'} // Object{greeting:'hi'} anonymousGreet(); // TypeError: anonymousGreet is not a function var anonymousGreet // -> 호이스팅! = function(){// object 만들어짐(result) console.log('hi'); } 콜백함수와 비동기작업 콜백함수 (주로 이벤트 핸들러에서 사용) 매개변수를 통해 전달되고 전달받은 함수의 내부에서 어느 .. 자바스크립트_데이터타입과 연산자 Primitive Types(Number, String, boolean, undefined, null) - undefined : Js에 의해 처음 생성된 값, 설정되지 않은(' not set '), Number(undefined) > NaN(not a number) //by Value (primitives) var a = 3; var b; b = a; a = 2; console.log(a); // 2 console.log(b); // 3 Reference Types(Array, Object, Function) //by Reference (Objects including functions) var c = { greeting: 'hi'}; var d; // c와 d가 같은 메모리 공간을 가르키도록함 d = .. 자바스크립트_스코프 Execution Context 실행 컨텍스트는 실행 가능한 코드가 실행되기 위해 필요한 환경 이라고 말할 수 있다. (Execution Context에 대한 자세한 내용은 위 링크 클릭시 내용 참고) Lexical environments 중에서 어떤 환경이 실행되는지 Execution context에 의해 결정된다. (*Lexical enviornments : 코드를 어느 위치에 작성하느냐, 어떤것이 감싸고 있느냐 에 따라 다르게 작동한다는 의미) Execution Context의 두가지 단계 b(); console.log(a) var a = 'Hello World'; function b() { console.log('Called b'); } // called b // undefined (var a i.. Recursion 이해하기(Javascript) 번역 및 요약 Recursion is impractical 이 포스팅을 시작한 계기이다. 명확히 하자면, recursion은 큰 문제를 작고 동일한 문제들로 만드는데 효과적인 방법이다. 그렇기에, 코드의 가독성을 향상 시켜준다. 글을 읽기전 추천해줄 자료들 The stack data structure Javascript functions Variable scope and hoisting 본글의 목표 : 자바스크립트 recursion에 대한 깊은 이해, recursion이 사용되면 좋을 법한 사례들에 대한 이해, 기존의 코드를 recursion을 활용하여 새로 써보기 recursion의 좋은예시와 나쁜예시 알아보기 프로그래밍에서 recursion이란 무엇일까? recursion이란 function 그 자체가 반복적으로 .. JavaScript Reduce 자세히 알아보기 reduce 메소드 사용해서 평균값 찾기 합계를 로깅하기 전에, 합계를 array의 길이값으로 나눈 뒤에 리턴한다. for-loop와 같이 index의 수만큼 reduce가 array를 반복하게 해준다. const euros = [29.76, 41.85, 46.5]; const average = euros.reduce((total, amount, index, array) => { total += amount; if(index === array.length-1){ return total/array.length; } else { return total; } }); average // 39.37 Map 그리고 Filter로써의 reductions 일반적으로 array안의 수만큼 반복할 것이고, 단일 값을 리턴.. array 반복을 효과적으로 하기 위한 9가지 방법 Array Declaration var array = []; var array2 = new Array(); Array Initialization 선언과 동시에 초기화(?) var array1 = ['First', 'Second', 'Third', 'Fourth']; var array2 = new Array('First'); 선언 이후에 초기화 array1 = ['First', 'Second', 'Third', 'Fourth']; array2 = new Array('First'); Javascript Array 반복 메소드들 1. Array.map() map을 사용하면, 각각의 array element들에 대하여 어떤 실행을 한 새로운 array element를 만들어 낸다. 원래의 array에는 변화가 .. 이전 1 2 다음
