프론트엔드 스터디

내장 객체 (build-in object) : 기존에 존재하는 객체 1.래퍼 객체 (wrapper object) : 원시타입의 값을 감싸서 마치 객체처럼 사용할 수 있도록 하는 역할 1)Number 객체 : number 타입에서 사용 가능한 내장객체 2)String 객체 : string 타입에서 사용 가능한 내장객체 script const nn = 1234; //typeof : number(숫자열) console.log(nn); //1234 그냥 출력 (넘버타입) console.log(nn.toString()); //숫자>문자열로 변환 // nn뒤에 .을 찍어 보면 사용할 수 있는 매서드가 뜬다 // 숫자 원시타입을 감싸고 있는 Number 객체로 감싸짐 const tt = ' 글씨 '; //typeof..

객체지향 프로그래밍 1)생성자함수 (고전방식) 2)클래스 (객체를 생성할 수 있는 템플릿) script class Fruit{ //함수명은 대문자로 시작!!!! constructor(name,color,emoji){ this.name=name; this.color=color; this.emoji=emoji; } display = () => { //this 필요x console.log(`${this.name}:${this.emoji}`); } } // 생성자 함수와 사용법 동일 // 인스턴스 - 클래스를 통해서 만들어진 객체 const cherry=new Fruit('cherry','red','🍒'); // cherry는 Fruit 클래스의 인스턴스이다 const grape=new Fruit('grape'..

객체 (Object - 복합데이터, 그룹화) -속성(property) : 객체내의 변수, 특징 (key와 value로 구성) -매서드(method) : 객체의 일부로 선언된 함수, 작업명령 1.객체 생성방법 1)object literal {key:value} script 1. object literal { key:value, key:value, method } key - 문자, 숫자, 심볼... value - 원시값(문자, 숫자...), 객체(함수) const apple={ name : 'apple', price : 1000, 3 : 1004, 'apple-color' : 'red', display : function(){ console.log(`사과는 영어로?${apple.name}`); } } // ..

함수 Function : 특정한 일을 수행하는 코드의 집합 가독성, 재사용 가능, 유지보수성 1.사용방법 1)선언적 함수(일반, 함수 선언식) script 1.선언적 함수(일반, 함수 선언식) function 함수명(){ 자바스크립트 코드들... } 함수명(); 위에서 정의한 함수 실행(호출) function add(a,b){ const result=a+b; console.log(result); } add(10,20); // 30 2)익명 함수, 함수 표현식 : 함수 이름이 없는 함수, 변수를 함수처럼 사용, 함수도 객체이기 때문에 가능 script 2.익명 함수, 함수 표현식 변수명=function(){ 자바스크립트 코드들... } 변수명(); 함수 실행 let aaa = function(){ let ..

1.출력 명령어들 1)document.write ('화면에 그냥 출력!'); 2)alert('경고창'); 경고창, 확인버튼 3)confirm('확인창'); 확인창, 확인,취소버튼 4)prompt('제목','입력할 내용(생략가능)'); 입력창 입력칸,확인,취소버튼 2.조건문 (Conditional Statement) 1)if 문 2)if / else 문 3)if / else if /else 문 script 1)if문 if(조건){ 조건이 충족했을 때 실행구 }; 2)if/else문 if(조건){ 조건이 충족했을 때 실행구 }else{ 조건이 충족하지 않았을 때 실행구 }; 3)if/else if/else문 if(조건1){ 조건1이 충족했을 때 실행구 }else if(조건2){ 조건2가 충족했을 때 실행구 ..

연산자 : 변수나 값의 연산을 위해 사용되는 부호 1.산술연산자 2.단항연산자 3.할당(대입)연산자 4.증감연산자 5.비교연산자 6.논리연산자 1.산술연산자 [ + , - , * , / , % , ** ] : 사칙연산을 다루는 연산자 script let num1 = 5; let num2 = 3; console.log('5+3=',num1+num2); //8 console.log('5-3=',num1-num2); //2 console.log('5*3=',num1*num2); //15 console.log('5/3=',num1/num2); //1.6666666666666667 console.log('5%3=',num1%num2); //2 (5를 3으로 나누고 남은 값) console.log('5**3=',n..

1.변수 (variable) 계속 변하는 값이면서, 그 값을 저장하는 공간 2.변수의 이름 (식별자) 생성 조건 1)영어(대,소문자 구분) , 숫자 , _ , $ 로만 구성 2)의미있는 단어로, 구체적으로 생성해야함 3)식별자 표기법 -카멜케이스 camelCase (뒷단어 첫대문자, 일반적으로 사용) -파스칼 표기법 PascalCase (단어들 다 첫 대문자로) -언더바 표기법 under_bar (언더바로 이어줌) 4)예약어 X 5)숫자로 시작 X 3.변수의 선언,초기화,할당 1)변수의 선언 var / let / const를 통하여 변수를 선언 2)초기화 (initialization) 변수의 선언과 동시에 초기값을 설정해주는 것 3)할당 (assignment) 이미 선언한 변수에 값을 할당(대입)하는 것..

node 1)node란 html 없이 자바스크립트를 스스로 작동할 수 있게 해주는 프로그램 2)node설치법 https://nodejs.org/ko/ > 16.17.0 LTS 다운로드 > 기본 설치 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 3)nodemon 설치법 vs코드 재시작(필수!!!) vscode > 터미널 > 새터미널 클릭 후 터미널 입력창에 npm install nodemon -g 입력(-g:전체 적용) 4)버전 확인법 터미널 또는 cmd(Command Prompt)에서 아래 내용 입력 node -v node --version 5)파일 실시간 확인하는법 (nodemon) ..

1.데이터 타입(Data Types) 프로그램에서 다룰 수 있는 값의 종류 2.데이터 타입 종류 1)원시타입(단일 데이터, primitive type) : 값이 복사되어 전달됨 -Number(숫자) -String(문자열) -Boolean(논리형, 참(true)/거짓(false)) -Symbol(유일하고 변경할 수 없는 타입, 객체의 프로퍼티를 위한 식별자로 사용) -Undefined (정의되지 않은 상태) -Null (값이 비어있는 상태) script // null, undefined의 차이 let vari; console.log(vari); //undefined (정의되지 않은) vari=null; console.log(vari); //null (비어있는, 의도적으로 변수에 값이 없다는 것을 명시할 때..