fullstack-study

생성자함수와 클래스 프로토타입 생성자함수생성자함수 상속클래스클래스 상속 클래스 오버라이딩클래스 get/set  1. Prototype  프로토타입  자바스크립트의 프로토타입(Prototype)은 모든 객체가 상속받는 속성과 메서드를 정의한 객체입니다. 모든 JavaScript 객체는 내부적으로 프로토타입을 가지고 있습니다. 프로토타입은 객체 간의 상속 관계를 정의하고, 객체가 원시적인 값을 가지지 않고 다른 객체를 기반으로 하도록 합니다. 프로토타입은 객체 지향 프로그래밍에서 중요한 개념이며, 상속, 코드 재사용, 객체 지향 디자인 패턴 등을 구현하는 데에 널리 사용됩니다. 상속 (Inheritance): 모든 JavaScript 객체는 다른 객체로부터 상속된 속성과 메서드를 가질 수 있습니다. 객체가 ..

# 비구조화 할당 ( 구조분해 ) 문법 비구조화 할당 문법은 객체 안에 있는 값을 추출해서 변수 혹은 상수로 바로 선언할 수 있습니다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment 구조 분해 할당 - JavaScript | MDN 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다. developer.mozilla.org 비구조화 할당 ex1) const array = [10, 20]; const [a, b] = array; console.log(a); console.log(b); ex2) const..

얕은 복사와 깊은 복사 얕은 복사(Shallow Copy) : 참조형의 1차원 데이터만 복사 깊은 복사(Deep Copy) : 참조형의 모든 차원 데이터를 복사 얕은 복사 : 주소값까지만 복사 깊은 복사 : 실제 데이터까지 복사 원시타입 : Call by value number , string , boolean , undefined , null , symbol 참조타입 : Call by reference 배열, 객체 Call by value(값에 의한 호출, 값의 복사) Call by reference(참조에 의한 호출, 주소의 복사) 예시 1) const arr = [ 10,20,30 ] const arrCopy = arr const 키워드로 선언된 arr( 안에 담기 주소값 )는 변환되지 않습니다. ..

# Object와 JSON차이점, 스프레드연산자, 나머지연산자, 옵셔널 체이닝   Object와 JSON의 차이점 JavaScript Object : JS Object JSON(JavaScript Object Notation) : JSON Object   JS Object : 객체의 내용을 기술하기 위한 텍스트 파일 JSON Object : JS Engine 메모리 안에 있는 데이터 구조 https://fullstack-eun.tistory.com/46 [ javascript ] 06. 원시타입, 참조타입, 객체원시(Primitive) 타입, 참조(Reference) 타입 자바스크립은 크게 원시타입과 참조타입 2가지로 나눕니다. 원시타입은 number, bigint, string, boolean, ..

# 기본함수, 익명함수, 화살표함수  기본 함수 복습하고 이어서 보세요 https://fullstack-eun.tistory.com/45 [ javascript ] 05. 템플릿 리터널 , 함수, 내장함수# 템플릿 리터널 백틱(`)을 사용 let test='hi'; let output = `철수 ${hi}` console.log( output ) 함수 생성방법 파라미터정의하기 반환값 익명함수 즉시실행함수 함수 함수는 하나의 단위로 실행할 수 있도록fullstack-eun.tistory.com  예시)1)function make(numbers) { let results = []; for (const number of numbers) { if (number % 2 != 0) { ..

# Masonry https://masonry.desandro.com/ MasonryInstall Download CDN Link directly to Masonry files on unpkg. Package managers Install with Bower:  bower install masonry --save Install with npm:  npm install masonry-layout Getting started HTML Include the Masonry .js file in your site. Masonry works omasonry.desandro.com - CDN https://masonry.desandro.com/#cdn MasonryInstall..

# AOS https://michalsnik.github.io/aos/ AOS - Animate on scroll library AOS Animate On Scroll Library Scroll down michalsnik.github.io - CDN - JS 형식 ) 명령어 설명 data-aos 사용할 애니메이션 효과명 data-aos-easing 애니메이션 시간흐름에 따른 속도설정 옵션(default: ease) data-aos-anchor 특정한 객체에 anchor를 설정, 어떤 객체를 기준으로 애니메이션이 시작 될지를 설정 data-aos-delay 애니메이션 재생 대기시간 설정(default: 0) data-aos-offset 애니메이션 효과가 시작될 객체의 위치 설정 data-aos-durat..

# swiper https://swiperjs.com/demos Swiper Demos Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com - CDN https://swiperjs.com/get-started#use-swiper-from-cdn Swiper - The Most Modern Mobile Touch Slider Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavi..

# 플러그인 사이트  http://www.htmldrive.net/ HtmlDrive - Free Dhtml scripts,Jquery plugins,Javascript,CSS,CSS3,Html5 Library www.htmldrive.net https://www.jqueryscript.net/ Free jQuery Plugins and Tutorials - jQuery Script www.jqueryscript.net # fancybox https://fancyapps.com/ Fancyapps UI | Robust JavaScript UI Component LibraryCarousel Responsive, touch-friendly carousels..

# Sass ( SCSS ) 작성법  SCSS와 Sass는 둘 다 CSS의 전처리기로, CSS를 더 쉽게 작성하고 관리할 수 있도록 도와줍니다.  문법: Sass (Syntactically Awesome Style Sheets): 들여쓰기를 사용하여 CSS와 다르게 보이게 만들어줍니다. 중괄호 {}와 세미콜론 ;을 사용하지 않습니다.SCSS (Sassy CSS): CSS와 유사한 문법을 가지고 있습니다. 중괄호 {}와 세미콜론 ;을 사용하여 CSS와 거의 동일한 구조를 가지고 있습니다.호환성:SCSS는 CSS와 거의 동일한 문법을 사용하기 때문에 기존 CSS 파일을 쉽게 가져와서 수정할 수 있습니다.Sass 는 기존 CSS 파일과 호환성이 떨어질 수 있습니다. 기존 CSS를 Sass 로 변환하기 위해서는..