본문 바로가기
반응형

분류 전체보기119

TIL 1006 Nodes vs Elements .contains() .parentElement Nodes vs Elements nodes DOM API상에 존재하는 모든 것들. 그것들을 모두 포괄하는 이름이 node이다. elements one specific type of node. 예를 들어 div, body, window 같은 특정한 타입. 모든 element는 HTMLElement의 자식이다. 따라서, HTMLElement의 property를 똑같이 가지고 있다. 동시에, element의 성격에 따라서 자신만의 property를 가지고 있다. NodeList: general lists of nodes HTML Collection: 오직 element만을 담을 수 있다. * DOM API (Document Object Model 문서 개체 모델 Application Programming In.. 2020. 10. 6.
TIL 0925~26 arr.reduce() filter() map() sort() some() find() 초기값을 줬을 때 arr.reduce( func( acc, val ) { ... } , initialValue ); acc에 initialValue가 들어가고 val엔 arr의 첫번째 요소가 들어간다. 이후론 val에 arr의 다음요소가 순서대로 들어가며 콜백함수를 반복. 초기값을 주지 않았을 때 arr.reduce( func( acc, val ) { ... }); acc에 arr의 첫번째 요소가 들어가고 val엔 arr의 두번째 요소가 들어간다. 이후론 val에 arr의 세번째 요소부터 순서대로 들어가며 콜백함수를 반복. arr.reduce()예제 var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alic.. 2020. 9. 25.
TIL 0924 날짜 2자리로 노드리스트reverse localStorage moment.js 날짜 2자리 표시 (“0” + this.getDate()).slice(-2); 월 2자리 표시 (“0” + (this.getMonth() + 1)).slice(-2); //querySelectorAll로 가져온 노드리스트를 reverse하는 방법 You can't call Array.prototype.reverse on NodeListCollection. Instead, you should use: var stars = [].slice.call(stars, 0).reverse() localStorage 사용법. 출처 : www.taniarascia.com/how-to-use-local-storage-with-javascript/ [ How to Use Local Storage with JavaSc.. 2020. 9. 24.
TIL 0923 요소 숨기기, 보이기 스타일 추가 정규표현식 버블링 vs 캡쳐링 onclick() vs addEventListener 보호되어 있는 글 입니다. 2020. 9. 23.
TIL 0922 CSS 가운데정렬 display DOM CSS 요소들을 가운데정렬 할 때 .contentwrapper{ margin: 0px auto; } font-weight: bold; //폰트 굵게 text-shadow: 1px 1px 2px black; //폰트에 그림자 추가 padding: 1px 2px 3px 4px; 순서대로 시계방향 북 동 남 서(margin 또한 동일) 적용된 모습 더많은 정보 poiemaweb.com/css3-display [ CSS3 Display | PoiemaWeb display 프로퍼티는 layout 정의에 자주 사용되는 중요한 프로퍼티이다. poiemaweb.com ](https://poiemaweb.com/css3-display) DOM 엘리먼트 만들기 const oneDiv = document.createElem.. 2020. 9. 22.
코드스테이츠 Full Pre 2주차 회고 풀타임 교육이 처음은 아니지만 전에 겪었던 풀타임 교육과는 뭔가 학습량이 비교가 안되는 것 같다. 1주차까지는 한번 배워봐서 아는 내용이 대부분이었기 때문에 크게 문제없이 복습하듯 술술 넘어갔지만 2주차부터 그동안 맘 놓고 있었지? 하는듯한 느낌으로 헷갈리는 것, 몰랐던 것들이 우수수 쏟아졌다. 배워봤다고 너무 안일하게 공부하고 있지 않았나 반성하게 됐다. 공부 방식에도 변화가 필요할 것 같았다. 기존의 몰랐던 것을 필기하고 외우기만 했던 방식에서 이것이 왜 필요하고 어떻게 써야할지 잘 숙지할 수 있도록 정리하는 방식으로 바꿨다. 나만 알아볼 수 있는 방식으로 정리했다는 점은 똑같아서 공유는 차마 못하겠다.. 학습량에 치이면서 내 이해력과 기억력을 혹사시키면서도 코드스테이츠의 커리큘럼은 좋은것 같다. 물.. 2020. 9. 20.
TIL 0918 클래스 Math.max arguments RestParameter / SpreadSyntax 클래스 정의 ES5 에서 클래스는 함수로 정의할 수 있다. 아래는 클래스의 속성과 메서드를 정의한 모습 function Car(brand, name, color){ this.brand = brand; this.name = name; this.color = color; } function Car(brand, name, color){ //인스턴스가 만들어질 때 실행되는 코드 Car.prototype.refuel = function (){ //연료 공급을 위한 코드 } } ES6 에서 클래스는 클래스로 정의한다. 속성과 메서드 정의 class Car(){ constructor(brand, name, color){ this.brand = brand; this.name = name; this.color = col.. 2020. 9. 18.
TIL 0917 Testbuilder, 조건문, 리터럴, IIFE(Immediately invoked function expression) 조건문 /** * Maestro 앞자리 5018 5020 5038 6304 이고 length 12 ~ 19 * * China UnionPay 622126-622925 624-626 6282-6288 이고 length 16 ~ 19 * * Switch 4903 4905 4911 4936 564182 633110 6333 6759 length 16 18 19 */ if(['5018', '5020', '5038', '6304'].includes(cardNumber.substring(0,4)) //앞4자리가 배열값중 하나일때 && (cardNumber.length >= 12 && cardNumber.length = 622126 && Number(cardNumber.substring(0,6)) =6282 && N.. 2020. 9. 17.
함수 선언식, 함수 표현식 함수 선언식(Function Declaration) function something() { ... } function funcDeclaration() { return 'function declaration'; } funcDeclarations(); // 'function declaration' 함수 표현식 (Function Expression) let something = function () { ... }; let funcExpression = function () { return 'function expression'; } funcExpression(); // 'function expression' 차이점 함수 선언식은 호이스팅에 영향을 받지만, 함수 표현식은 호이스팅에 영향을 받지 않는다. 함수 .. 2020. 9. 17.
반응형