웹찢남

Event – onclick=”nightDayHandler(this);”,onchange,onkeykown Datatype - number String – x.length / x.toUpperCase() / x.indexOf(y) / x.trim() / x.replace(‘a’,’b’) Function nightDayHandler(self){ Var target= Document.querySelector(‘body’). Target.style.backgroundColor=’white’; If(target.dataset.mode===’day’){ self.value=’day’; }else{ self.value=’night’;} Var links=document.querySelectorAll(‘a’); --..

CSS도 정리해 봤습니다! h1{color:red;font-size:12px;} 여기서 h1은 선택자 color는 속성 red는 값 {}내의 내용은 Declaration 선택자에는 위의 h1과 같이 tag 선택자, id 선택자 (#), class 선택자 (.)가 있다. Id는 pk의 개념이고 class는 그룹으로 생각하여 해당 선택자를 사용해야 한다. ul li {} -> ul 밑의 li 만 css 속성을 먹임 (조상 자손 선택자) #lecture>li {} -> lecture의 직계 자손의 li에만 css를 먹음 (부모 자식 선택자) orange.small -> tag이름이 orange인데 class 가 small 인 경우 ul,ol {} -> ul과 ol을 동시에 선택 plate+apple -> pl..

공부용으로 HTML 관련 문헌들 쭉 보면서 머리를 한번 정리 해봤어요! 참고하세요! target=”_blank” -> 새창에서 로드 title=”12” -> 마우스 올렸을 때 나오는 글 각각의 항목들을 구분 li:list 로 그룹핑 ul: unordered list 는 숫자로 항목을 구분 1,2,3,4 ol: ordered list -> 문서의 인코딩 방법 -> Document type declatation (브라우저에게 이거는 어떤 표준을 따르는지 알려주는 태그) -> 단락을 설정해줌, p와p의 사이엔 기본적으로 indent가 있음 -> 줄 바꿈이 한 줄만 있음 p태그는 두 줄 있음 height 하나만 설정하면 비율 맞게 조정, alt는 사진이 깨질 경우 대체 텍스트, title은 마우스를 올렸을 때 ..

리덕스란 컨텍스트보다 조금 더 체계적으로 데이터를 관리할 수 있도록 한다. 리덕스는 데이터를 스토어라는 곳에서 관리한다. 프로퍼티의 경우 상위 컴포넌트에서 하위 컴포넌트로 전달되는 읽기 전용 데이터 state는 컴포넌트의 state를 저장하고 변경할 수 있는 데이터다. 컨텍스트는 부모 컴포넌트에서 생성하여 모든 자식 컴포넌트에 전달하는 데이터 리덕스는 서버에서 받은 데이터를 앱 전체에 전달하거나 관리한다. 컴포넌트는 dispatch 함수를 통해 리듀서에 액션을 전달한다. 액션에는 리듀서에서 처리해야 할 작업의 이름과 데이터가 객체 형태로 들어있다. 리듀서는 액션을 받아 스토어 변경 작업을 진행한다. 스토어 변경 작업이 완료되면 connect 함수로 연결된 컴포넌트에 변경된 스토어의 데이터를 전파하여 동기..

전에 배운 프로퍼티나 state는 부모와 자식 컴포넌트가 연결된 상태에서 공유하는 데이터다. 따라서 연결되지 않은 컴포넌트들 끼리 데이터를 공유해야할때 컨텍스트를 사용한다. 프로퍼티의 경우 컴포넌트가 1->2->3->4일 경우 1에서 4로 데이터를 전달하면 모든 단계를 다 거쳐야하는데 이때 해당 프로퍼티가 모든 컴포넌트에서 사용하지 않을 수도 있고 전달과정에서 누락될 수 있다. 이를 위해 도입한 디자인 패턴이 관찰자 패턴이다. 쉽게 말해 공급자는 데이터를 공급하는 역할, 관찰자는 이를 구독하여 데이터를 소비하는 역할이다. 따라서 관찰자는 소비자라고도 한다. 위의 관찰자 패턴을 도입하면 1->공급자->소비자->4로 여러 컴포넌트들을 거치지않고 데이터를 전달 할 수 있게 된다. 이에 따라 컴포넌트간의 자료 ..

전에 배운 withstyles 함수에서 우리는 이미 커링을 사용했습니다. 커링이란 반환값이 함수인 디자인 패턴을 말하며 중복된 코드를 반복적으로 입력하지 않고 원하는 기능을 조합하여 적재적소에 사용할 수 있다. 커링이란 쉽게 말하면 함수를 반환하는 함수다. 함수의 반환은 쉽게보면 아래와 같다. function mul(a,b){ return a*b; } function mulX(x){ return function(a) { return mul(a,x); } } 위와 같은 함수가 두개 있다고 할 경우 mulX를 사용하여 아래와 같이 다양한 곱 함수를 만들 수 있다. const multhree=mulX(3); const mulfour=mulX(4); const result1=multhree(3); //3x3=9..