javascript6

• 

  Javascript : 2월 13일 프로토타입 예제function Animal (name) { this.name = name;}Animal.prototype.speak = function() { console.log(this.name + " makes a sound.");};function Dog(name) { Animal.call(this, name);}Dog.prototype = Object.create(Animal.prototype);Dog.prototype.constructor = Dog;Dog.prototype.bark = function() { console.log(this.name + " barks.");};const dog = new Dog("Mimi");dog.speak();dog.bark();cons.. HANCOM AI ACAMEMY/수업 및 플젝 2025. 2. 13.

• 

  자바스크립트 정리 7차시 객체(Object)- 관련된 정보를 하나로 묶어주는 특별한 상자- 데이터를 키-값 쌍으로 저장하는 자료 구조 1) 객체를 정의하는 방법(1) 객체 리터럴 let person = { name : "Alice", age : 30,} // 중괄호로 객체 작성(2) Object 생성자 함수let person = new Object(); // 빈 객체를 생성하고 나중에 속성 추가 가능person.name = "Bob"; person.age = 25;(3) 생성자 함수 : 객체 생성을 위한 템플릿 역할function Person(name, age){ this.name = name; this.age = age;}let person1 = new Person("Charlie", 30); // new 키워드와.. HANCOM AI ACAMEMY 2025. 2. 12.

• 

  Javascript : 2월 12일 document는 웹브라우저에서만 생성되는 객체이다. 서버에는 document 객체가 없음   으로 입력데이터를 한번에 묶어줌예를 들어 로그인 시 아이디- 비밀번호  - 편의를 위해 setAttribute대신 쓸 수있는 classList 만듦  스프레드 연산자와 레스트 연산자배열과 객체에서 스프레드 연산자를 활용하자!함수 매개변수에서 레스트 연산자를 사용하자! 스프레드 연산자- 배열이나 객체의요소를 개별적으로 확장하는 자바스크립트 연산자- 세개의 점(...)으로 표현 1. 배열에서의 스프레드 연산자1) 배열 복사- const originial = [ 1, 2, 3 ]; const copy = [ ...original, 4, 5 ];- spread 연산자를 쓰지 않고 복사하면  이중 배열이 됨 ex. [ .. HANCOM AI ACAMEMY/수업 및 플젝 2025. 2. 12.

• 

  Javascript : 2월 11일 1. inline_script console.log("Hello, Inline JavaScript!");  console이라는 객체에 log라는 method가 있는거임 인자로 string을 보냄 3. variables_value_change- const로 선언되어 있어도 객체나 배열, 참조형 데이터 타입인 경우 값은 변환할 수 있음- var와 let, const는 scope가 다름 5. variables_declaration_only변수 설정할 때 초기값 설정 안 해도 괜찮음 기본적으로 undefined가 저장되어있음 8. datatype_string String - JavaScript | MDNString 전역 객체는 문자열(문자의 나열)의 생성자입니다.developer.mozilla.orgMDN 홈.. HANCOM AI ACAMEMY/수업 및 플젝 2025. 2. 11.

• Javascript : 2월 10일 indexOf()없으면 -1로 반환 이유: index 순서 0이랑 헷갈려서 7차시 객체와 Map 객체는 관련된정보를 하나로 묶어주는 특별한 상자이다 ( = 데이터를 키-값 쌍으로 저장하는 자료구조 )let student = { name = "john", }- name은 키, john은 값 function Person(name, age) { this.name = name; this.age = age;}- 괄호 안을 파라미터라고 부름 let person1 = new Person("Charlie", 30);- new로 인스턴스 생성  · ctrl + '/'하면 한번에 주석처리 가능 · key에 공백이 있으면 .으로 소환할 수 없어서 [" "] 사용  · 절차지향프로그래밍에서 객체지향프로그래밍으로 트렌드 .. HANCOM AI ACAMEMY/수업 및 플젝 2025. 2. 10.

• 

  HTML/CSS, Javascript : 2월 7일 HTML/CSS flex:1의 역할[예시 1] .event { display: flex; background: #ff5722; padding: 20px; }   [예시 2] .event { display: flex; flex: 1; background: #ff5722; padding: 20px; }  딱 1대 1로 상자 크기를 잡아줌!  [예시 3]  .event { display: flex; flex: 1; background: #ff5722; padding: 20px; }.event2 { flex: 2;}  /* 원랜 필요없는 속성임 */  - div, section 등을 세세하게 구분하는 건 큰 의미없다. 유명한 포털도 기능 구현에 목적을 둠. - 실습과제 홈페이지(티르티르) 따라 만들기 -> 똑같.. HANCOM AI ACAMEMY/수업 및 플젝 2025. 2. 7.