공부하는 비오

forEach Array.forEach( callback(element, [index]) ) 배열의 각 요소에 콜백함수를 적용. 콜백함수의 인자는 배열의 요소값, 인덱스값 등을 나타냄. map Array.map( callback(element) ) 배열의 각 요소에 콜백함수 적용하여 일괄 변경. 콜백함수의 리턴을 모아 새로운 배열을 만드는 것이 목적. 보통 const arr2 = arr1.map( callback()) 의 형태로 많이 사용 filter Array.filter( callback(element) ) 배열의 각 요소 중 콜백함수에 해당하는 요소를 찾아서 배열로 반환. 만족하는 요소가 없다면 빈배열을 반환. 콜백함수의 리턴값은 boolean(true or false)값을 가짐. find Arra..

JavaScript 2020. 10. 12. 17:01

유사배열 직접 배열리터럴로 선언한 배열만 배열. 유사배열은 아래의 예시로 살펴보자. [ ]로 감싸져있지만 배열이 아닌 것들을 유사배열이라 부름. 유사배열의 경우 배열 메서드를 사용할 수 없음. >> call이나 apply를 사용하여 배열메서드를 적용할 수 있다. forEach를 다음과 같은 방법으로 적용할 수 있음! [ ].forEach.call(checkBox, function(e){ ... }); ECMA6에서는 아래와 같은 방법으로도 사용할 수 있다. Array.from(checkBox).forEach(function(e){ ... });

JavaScript 2020. 9. 30. 23:16

getter getter은 클래스필드의 값을 조작하는 행위가 필요할 때 사용. getter은 무언가를 얻기위해 사용하는 것이므로 반드시 무언가를 반환(return)해야 한다. class Object { ... get method( ) { return 반환; } } setter setter도 클래스필드의 값을 조작할 때 사용. class Object { ... get method( elem ) { ...elem...; } } getter은 firstElem의 값을 반환할 때 사용. setter은 firstElem에 elem를 추가(조작)할때 사용.

JavaScript 2020. 9. 23. 16:14

스코프 ? 유효범위. (참조대상식별자의 유효범위) 참조 대상 식별자를 찾아내기 위한 규칙. (참조 대상 식별자 == identifier, 변수, 함수의 이름과 같이 식별할 수 있는 이름) 예를 들어 전역에 선언된 변수 x는 어디서든 참조할 수 있지만, 함수 내에 선언된 변수 x는 함수 외부에서는 참조 할 수 없다. 이런 규칙을 스코프라고 부른다. >> 자바스크립트의 변수(var)는 함수 레벨 스코프(function-level scope)를 따른다. 그러나 var 대신 let을 사용하면 블록 레벨 스코프(block-level scope)를 사용할 수 있다. 함수레벨 스코프의 경우, 함수 밖에서 선언된 변수는 코드블록내에서 선언되었다 할지라도 전역스코프를 가진다. 함수 내에서 선언되었을 경우 지역스코프를 가..

JavaScript 2020. 8. 25. 00:11

높이 너비 요소 clientHeight padding을 포함한 높이 clientWidth padding을 포함한 폭 scrollHeight padding을 포함한 화면 상에 표시되지 않은 콘텐츠를 포함한 높이 scrollWidth padding을 포함한 화면 상에 표시되지 않은 콘텐츠를 포함한 폭 offsetHeight border, padding, 스크롤 바를 포함한 높이 offsetWidth border, padding, 스크롤 바를 포함한 폭 창 (브라우저) window.innerHeight 스크롤 바를 포함하지 않은 창 높이 window.innerWidth 스크롤 바를 포함하지 않는 창 너비 window.outerHeight 스크롤 바를 포함한 창의 높이 window.outerWidth 스크롤 바..

JavaScript 2020. 8. 14. 11:42

prototype과 __proto__ 이런게 있구나 하고 알아두면 좋을 이론. 우선 javascript에서 함수는 사실 객체라고 할 수있다. function Object(매개변수1, 매개변수2, 매개변수3){ this.매개변수1 = 매개변수1; this.매개변수2 = 매개변수2; this.매개변수3 = 매개변수3; } >> 객체이기 때문에 속성값(매개변수)를 가질 수 있음. 예제를 통해 prototype과 __proto__가 어떻게 다른지, 또 이 둘이 어떻게 작동하는지를 알아보자. name, first, second 속성을 가진 'Person' 객체를 생성한다. 여기서 { } 안에 내용은 prototype으로, 이 프로토타입을 가지는 다른 객체를 생성 할 수 있다. Person객체를 생성할 때, 사실 ..

JavaScript 2020. 8. 5. 02:02

이번 포스트 코딩은 위에서부터 쭈욱이어짐 call 객체와 함수를 따로 생성했을 때, call이라는 메서드를 사용하여, 함수를 객체의 메서드로 사용할 수 있다. (call이랑 유사한 메서드로 apply도 있음) var Object = { } function Fn(){} Fn.call(Object) ex. 함수에 매개변수도 사용할 수 있음. function Fn(parameter){ 코드 } Fn.call(Objet, parameter) 첫번째 인자는 this가 어떤 객체인지, 두번째 인자는 매개변수. ex. bind bind 메서드를 사용하면, 함수의 this값을 고정하는 새로운 함수를 만들 수 있다. var Object = { } function Fn(){} var Fn2 = Fn.bind(Object)..

JavaScript 2020. 8. 5. 01:39

객체 간의 상속 class를 이용한 방법이 아니어도, 객체 간에 상속을 받도록 부모객체를 설정할 수 있음. 방법 1. 부모객체.__proto__ = 자식객체; __proto__를 사용하는 방법은 자바스크립트표준은 아니지만 웬만한 브라우저에서 작동가능하다. superObj를 subObj의 부모객체로 지정(상속) 후, 부모객체인 superObj의 인자인 superVal을 subObj.superVal로 불러올 수 있음. ** subObj.superVal = 'sub'로 바꾸어도, superObj.superVal은 바뀌지 않음. subObj.superVal만 바뀜. 방법 2. __proto__를 대신하여 만들어진 방법. var 자식객체 = Object.creat(부모객체); __proto__ 메서드를 사용하는 ..

JavaScript 2020. 8. 1. 10:37