이롭게 현명하게

목차 window.alert() 메서드 HTML DOM 요소 사용 document.write() 메서드 console.log() 메서드 [window.alert() 메서드] window.alert() 메서드 : 브라우저와는 별도의 대화 상자를 띄워 사용자에게 데이터를 전달한다. 알림창 이라고도 한다. window객체의 모든 메서드나 프로퍼티를 사용할 때는 window라는 접두사를 생략할 수 있다. Window 객체의 alert() 메소드 alert 대화 상자 [HTML DOM 요소 사용] HTML DOM 요소를 이용한 innerHTML 프로퍼티는 실제 자바스크립트 코드에서 출력을 위해 가장 많이 사용되는 방법이다. document 객체의 getElementByID()나 getElementsByTagNam..

목차 내부 자바스크립트 코드 외부 자바스크립트 코드 자바스크립트를 적용하기 위해서는 에디터가 필요하다. [vscode 설치하기] [VSCODE] VSCODE 설치 / Visual Studio Code 설치하기 목차 VSCODE 설치 VSCODE 환경설정 (한글설정) 번외 [ VSCODE 설치 ] 1. 홈페이지 접속 2. 본인의 운영체제에 맞는 설치 파일 클릭 저는 window운영체제로 설치하였습니다. 2. 설치 파일 클릭 후 동의합니다 devyihyun.tistory.com [내부 자바스크립트 코드로 적용] 자바스크립트 코드는 태그를 사용하여 HTML 문서 안에 삽입할 수 있다. HTML 문서의 자바스크립트를 이용하면 현재 날짜와 시간 정보에도 손쉽게 접근할 수 있어요! 1. 현재 날짜와 시간 표시하기!..

목차 개요 기초 소개 [자바스크립트 개요] HTML : 웹의 내용을 작성 CSS : 웹을 디자인 JavaScript : 객체(object) 기반의 스크립트 언어로 웹의 동작을 구현할 수 있다. 자바스크립트는 주로 웹 브라우저에서 사용되나 Node.js 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있다. 컴퓨터, 스마트 폰에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어있다. [자바스크립트 기초] 자바스크립트를 배우기 전에 필요한 기초 지식은 HTML과 CSS이다. 자바스크립트는 객체 기반의 스크립트 언어이다. 자바스크립트는 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어이다. 자바스크립트는 객체지향형 프로그래밍과 함수형 프로그래밍을 모두 표현할 수 있다. 🤔 인..

목차 scope 이해하기hoistingvar의 호이스팅let의 호이스팅호이스팅을 피해야 하는 이유  https://devyihyun.tistory.com/124 [JavaScript] 자바스크립트 변수(var, let, const)목차 var, let, const란?var 특징let 특징const 특징var를 사용하면 안 되는 이유   varletconst중복선언가능금지금지재할당가능가능금지스코프함수 레벨 스코프블록 레벨 스코프블록 레벨 스코프선언/devyihyun.tistory.com    [scope 이해하기]scope : 변수, 함수를 선언할 때 해당 변수 또는 함수가 사용할 수 있는 범위를 의미한다. Global : 코드의 전 범위에서 사용할 수 있다.Function : 특정 함수 내부에서만 사용할..

목차 spread 연산자 rest 함수 파라미터에서의 rest 함수 인자에서의 spread [spread 연산자] spread : 펼치다, 퍼트리다 이 문법을 사용하면 객체 혹은 배열을 펼칠 수 있다. const slime = { name : '슬라임' }; const cuteSlime = { name : '슬라임', attribute : 'cute' } const purpleCuteSlime = { name : '슬라임', attribute : 'cute', color : 'purple' } 이 객체들을 출력한다면 다음과 같을 것이다. console.log(slime); console.log(cuteSlime); console.log(purpleCuteSlime); 각 slime마다 가지고 있는 속성들..

목차 프로토타입과 클래스 객체 생성자 객체 생성자 상속하기 ES6 Class [객체 생성자] 객체 생성자는 함수를 통해서 새로운 객체를 만들고 그 안에 넣고 싶은 값, 또는 함수를 구현할 수 있게 해 준다. 새로운 객체를 만들 때는 new라는 키워드를 사용한다. function Animal(type, name,sound){ this.type = type; this.name = name; this.sound = sound; this.say = function(){ console.log(this.sound); } } const dog = new Animal('개','멍멍이','멍멍'); const cat = new Animal('고양이','야옹이','야옹'); dog.say(); cat.say(); dog와..