목록 웹 개발 (48)
이롭게 현명하게
목차 개요 기초 소개 [자바스크립트 개요] HTML : 웹의 내용을 작성 CSS : 웹을 디자인 JavaScript : 객체(object) 기반의 스크립트 언어로 웹의 동작을 구현할 수 있다. 자바스크립트는 주로 웹 브라우저에서 사용되나 Node.js 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있다. 컴퓨터, 스마트 폰에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어있다. [자바스크립트 기초] 자바스크립트를 배우기 전에 필요한 기초 지식은 HTML과 CSS이다. 자바스크립트는 객체 기반의 스크립트 언어이다. 자바스크립트는 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어이다. 자바스크립트는 객체지향형 프로그래밍과 함수형 프로그래밍을 모두 표현할 수 있다. 🤔 인..
목차 forEach map filter splice와 slice shift, pop, unshift, push reduce [ forEach ] 배열 안에 있는 모든 원소들을 출력하고 싶을 때 사용한다. const coding = [ "c", "Java", "JavaScript", "Python", ] console.log(coding) // ["c", "Java", "JavaScript", "Python"] // 반복문 사용 for (let i = 0; i{ console.log(lang) }) //c //Java //JavaScript //Python // 에러 coding.forEach() [ map ] 배열 안에 모든 원소를 변환할 때 사용 for, forEach문을 사용해서 원소를 변환할 수 있..
목차 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와..
목차 객체 비구조화 할당 객체 안에 함수 넣기 Getter와 Setter [객체] 객체 : 어떠한 값을 선언하게 될 때 하나의 이름에 여러 종류의 값을 넣을 수 있게 해 준다. const dogName = "멍멍이"ㅣ const dogAge = 2; console.log(dogName); console.log(dogAge); // 객체 사용 const dog = { Name : "멍멍이", Age : 2 food : { a : 1, b : 2, ... } ... }; dog라는 객체의 내용을 보고 싶다면 key를 사용한다. // 객체 사용 const dog = { Name : "멍멍이", Age : 2 ... }; console.log(dog.Name); console.log(dog.Age); [비구조화..