공부하는 비오

유사배열 직접 배열리터럴로 선언한 배열만 배열. 유사배열은 아래의 예시로 살펴보자. [ ]로 감싸져있지만 배열이 아닌 것들을 유사배열이라 부름. 유사배열의 경우 배열 메서드를 사용할 수 없음. >> 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

Component ? Component는 HTML을 반환하는 '함수' 혹은 'class'이다. Component를 사용하면, 한번 짠 코드블록을 다른 곳에서도 component 한줄로 사용할 수 있음. 예를 들어 를 컴포너트로 만들면, 다른 페이지에서 이라고만 작성해도 사용가능. Component (사용자 정의 코드)의 장점. - 가독성을 높일 수 있음 - 재사용성이 높아짐(like as function) - 유지보수 편리(compoenet에서만 바꾸면 재사용한 모든 곳에서 변경되므로) src 폴더의 App.js 에서 지정. 참고로 Component를 만드는데 사용된 언어는 jsx 이다. facebook에서 개발한 js 확장언어라 생각하면 편리함. javascript에서 HTML의 형태로 코드를 사용하게..

React 2020. 8. 30. 23:19

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

JavaScript 2020. 8. 25. 00:11

white-space Property line break space, tab 자동 줄바꿈 normal 무시 1번만 반영 O nowrap 무시 1번만 반영 X pre 반영 그대로 반영 X pre-wrap 반영 그대로 반영 O pre-line 반영 1번만 반영 O text-overflow - clip : 영역을 벗어난 텍스트 값을 입력하지 않음. (default 값) - ellipsis : 영역을 벗어난 텍스트 값을 말줄임표(...)로 입력.

HTML & CSS 2020. 8. 22. 20:46

{background: color || image || repeat || attachment || position} > image : url("경로 입력") > repeat : repeat-x, repeat-y, no-repeat > attachment : fixed > position : px, %, top, right, bottome, left, center - px: left기준 top기준 (ex. position: 20px 30px) >> 속성 값을 입력할 때 ','를 넣어주면 다른 배경의 속성값으로 인식되므로, 한 배경의 여러 속성값을 입력하려면 ' '(공백)을 사용해야함. {background-size: px, %, cover, contain } -cover : 배경이미지 비율 그대로 큰 축에..

HTML & CSS 2020. 8. 22. 19:40

root를 사용하면 전역변수를 지정할 수 있다. 예를 들어 root를 사용하여 글자색을 지정해본다 하자. 각 요소에서 글자색을 지정해줬을 경우, 나중에 메인이 되는 글자색을 바꾸고 싶을때, 하나하나 찾아가며 바꿔주어야 하는 불편함이 있다. 하지만 root를 사용하면 root안에있는 코드만 바꿔주면 다른 요소들을 바꿀필요가 없으므로 유지보수가 편리하다. :root{ --text--color: white; --background--color: black; --link--padding: 10 20px; } ex.

HTML & CSS 2020. 8. 16. 22:23

높이 너비 요소 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