모던 자바스크립트 입문 4

[JS] 모던 자바스크립트 입문 8장 함수 예제 - 랜덤 그리기

// 이 코드는 모던 자바스크립트 입문(徹底マスターJavaScriptの教科書) 에서 인용한 것입니다. // [ISBN #978-4797388640]. Copyright 2017 by 磯博 모던 자바스크립트 입문 중에서 8장 (함수) 의 8-22 예제를 첨부한다. 원래예제와는 조금 다르게 선이 뻗어나갈때마다 색이 바뀌도록설정했다. 재밌는 예제다. 위처럼 랜덤으로 선이 뻗어나간다. 시간이 별로 없어서 책을 빠르게 읽었는데 중간에 있던 예제들은 그냥 지나칠 수가 없어서 하나 하나 전부 만들어봤는데 정말 재밌는 예제가 많다. 서평이 굉장히 좋은 책이었는데 맞는것같다. (물론 무슨 코드지? 하고 한동안 들여다본 코드들도 있다. 특히 좌표관련 코드이다. 그것들도 막 이해가 안되는 그런게 아니라 좀 들여다보면 이해가..

Web/javascript 2021.03.01

[JS] 가중산술평균과 이미지 필터링 기능의 구현

모던 자바스크립트 입문을 공부하는 도중 좀 복잡한 코드를 마주하게 되었다. 코드를 읽다가 도움이 될 수 있는 단서를 하나 발견했는데, 바로 가중 산술 평균이다. 가중 산술 평균은 가중 산술 평균은 자료의 평균을 구할 때 자료 값의 중요도나 영향 정도에 해당하는 가중치를 반영하여 구한 평균값이다. 라고 위키에 정의되어 있다. 그리고 아주 아주 친절한 부가설명도 존재한다. 출처: ko.wikipedia.org/wiki/%EA%B0%80%EC%A4%91_%EC%82%B0%EC%88%A0_%ED%8F%89%EA%B7%A0 딱 한번만 읽어봐도 이해가 될 정도로 간단한 예제이다. 즉 가중치를 분모로 잡아서 모두 더하고, 분자에는 해당 값들과의 곱을 더해서 평균을 구하는 것이다. 따라서 위처럼 픽셀의 정중앙의 값을 ..

Web/javascript 2021.02.26

[JS] 모던 자바스크립트 입문- 생명 게임 시뮬레이터 (2차원 배열의 생성)

모던 자바스크립트 입문의 17장에는 생명 게임 시뮬레이터 예제가 있다. 이 예제에서 화면의 view에 나타낼 픽셀을 배열로써 생성하는 파트가 있다. 코드는 다음과 같다. // 격자의 크기 state.nx = nx; state.ny = ny; // 셀의 상태를 저장하는 2차원 배열을 생성하고 초기화한다 state.cells = new Array(ny); for(var ix=0; ix

Web/javascript 2021.02.24

[JS] 특정 셀(ix,iy) 주변의 마리 수 구하기 (생명 게임) - 모던 자바스크립트 입문

최근에 모던 자바스크립트 입문이라는 책을 통해 자바스크립트를 공부 중인데, 17장에 보면 MVC 모델을 기반으로 하여 생명 게임 시뮬레이터를 실습하는 부분이 있다. 상당히 퀄리티 좋은 예제이고, 챕터 전체가 한 예제를 다루는 (입문으로 치면) 꽤 난이도 괜찮은 예제이다. 예제 중에서 특정 객체의 메소드가 이해가 되지 않아서 직접 어떻게 동작하는 지 그려보면서 알아봤는데, 이런 방법도 있구나 하고 놀라게 되었다. 해당 코드는 다음과 같다. state.getSumAround = function(ix,iy) { var dx = [ 0, 1, 1, 1, 0,-1,-1,-1]; var dy = [ 1, 1, 0,-1,-1,-1, 0, 1]; // 주기적 경계 조건 for(var k=0,sum=0; k

Web/javascript 2021.02.24
반응형