전체 글 338

[css] Selector

# css명령어 display속성 block 상자요소 inline 글자요소 none 보여짐특성없음, 화면에서 사라짐 [ex] -HTML A B C -CSS span{ background-color:skyblue; } .s1{ display:inline ; } # 순서없는목록 # 순서있는목록 [ex] 동물 기린 토끼 꽃 장미 튤립 # 스타일의종류 1 내부스타일 2 외부스타일 3 인라인스타일 4 @import스타일 [ex] 내부스타일 AAA HTML --> xxx.html CSS --> xxx.css JS --> xxx.js [ex] 외부스타일 -style1.css h1{ border:1px solid navy; background-color:orange; } -test.html AAA [ex] 인라인스타일..

Web/CSS 2023.10.31

ES6 와 syntactic sugar, prototype에 관하여

출처 https://ding-co.tistory.com/58 [모던 JS Deep Dive] 19장 - 프로토타입 19.0 프로토타입 - JS는 멀티 패러다임 프로그래밍 언어 (명령형, 함수형, 프로토타입 기반 객체 지향 프로그래밍 지원) - ES6 클래스 도입 - 클래스도 함수임, 기존 프로토타입 기반 패턴의 syntactic s ding-co.tistory.com 내 블로그 연관 내용 링크 https://delightpip.tistory.com/291 syntactic sugar - Specifically, a construct in a language is called syntactic sugar if it can be removed from the language without any effect..

Web/JavaScript 2023.10.31

[event handler]

event driven programming 이벤트 중심으로 프로그램 흐름을 제어함 application 이 특정 이벤트가 발생했을 때 해당 호출 함수를 브라우저에게 알려서 호출을 위임한다. event handler : 이벤트 발생 시 호출 함수 event handler 를 등록하여 이벤트 발생 시 브라우저에게 호출 위임 event type 마우스 이벤트 click: 마우스 버튼 클릭 dblclick: 마우스 버튼 더블 클릭 mousedown: 마우스 버튼 눌렀을 때 mouseup: 누르고 있던 마우스 버튼 놓았을 때 mousemove: 마우스 커서 움직였을 때 mouseenter: 마우스 커서를 HTML 요소 안으로 이동했을 때 (버블링 되지 않음) mouseover: 마우스 커서를 HTML 요소 안으..

Web/JavaScript 2023.10.30

[first-class object]

일급객체란 3가지 조건을 충족한 객체 모든 일급 객체는 변수나 데이터에 담을 수 있어야 한다. 모든 일급 객체는 함수의 파라미터로 전달 할 수 있어야 한다. 모든 일급 객체는 함수의 리턴값으로 사용 할수 있어야 한다. JAVA METHOD와 비교 자바 메소드 말고 자바의 람다식, 익명 클래스로 변수나 매개변수 할당이 가능하고, 리턴값으로도 사용할 수 있어 일급객체의 요건이 충족된다 같이 비교하자면 1. 변수할당 java method는 변수 할당이 불가능 public class Main { public static void hello(){ System.out.println("Hello World"); } public static void main(String[] args) { Object a = hello..

Web/JavaScript 2023.10.29

[property attribute]

Property -> internal slot / internal method 이중 대괄호로 감싼 이름을 말한다. 외부로 공개된 객체의 프로퍼티가 아니고, 내부 로직이다. 대신, 모든 객체는 [[Prototype]]이라는 내부 슬롯 가지고 있으므로=> __proto__ 를 통해 간접적으로 접근 가능하다 Property Attribute, Property Discripter Object -> property 생성 시에 해당 상태를 나타내는 Property Discripter를 기본값으로 자동 정의하는 것을 말한다 프로퍼티 상태 프로퍼티의 값 (value) 값 갱신 가능 여부 (writable) 열거 가능 여부 (enumerable) 재정의 가능 여부 (configurable) Property Attribu..

Web/JavaScript 2023.10.28

[기본] block level scope (const, let)

let 변수 중복 선언 금지 - let 키워드로 이름이 같은 변수를 중복 선언하면 SyntaxError 발생함 (구문/문법 에러) - 같은 스코프 내에서 중복 선언 허용 X (const 도 마찬가지) - 블록 레벨 스코프 - 모든 코드 블록(함수, if, for, while, try/catch 등)을 지역 스코프로 인정 - 변수 호이스팅 - let 키워드로 선언한 변수는 변수 호이스팅이 발생하지 않는 것처럼 동작 - let 키워드로 선언한 변수를 변수 선언문 이전에 참조하면 ReferenceError 발생 - let 키워드로 선언한 변수는 '선언 단계'와 '초기화 단계'가 분리되어 진행 - 스코프의 시작 지점부터 초기화 시작 지점까지 변수를 참조할 수 없는 구간 => TDZ (일시적 사각 지대) - 선언..

Web/JavaScript 2023.10.27

[기본] garbage collection

javascript 는 도달 가능성(reachability)이라는 개념으로 메모리 관리를 수행한다 -> 어떻게든 접근하거나 사용할 수 있는 값 : 메모리에서 삭제되지않음 이는 엔진이 자동 수행 하므로 이를 억지로 실행하거나 막을 수 없고 reachable 상태의 객체는 메모리에 남게된다. 참조된다고 해서 도달이 가능한 것이 아니다. 서로 연결된 객체들도 도달 불가능할 수 있다. https://jayconrod.com/posts/55/a-tour-of-v8-garbage-collection

Web/JavaScript 2023.10.26

[Function Declaration] 함수표현식, 콜백함수

function sayHi() { alert( "Hello" ); } 는 아래와 같다 let sayHi = function() { alert( "Hello" ); }; let func = sayHi; //함수 복사 func(); sayHi(); // 둘다 같은 함수로 동작한다 ###참고### 세미콜론 차이 꼭 알아둘 것 function sayHi() { // ... } let sayHi = function() { // ... }; 콜백함수 function ask(question, yes, no) { if (confirm(question)) yes() else no(); } ### question 이 들어 왔을 때 -> 결과에 따라yes 또는 no 호출 function showOk() { alert( "동..

Web/JavaScript 2023.10.25
728x90