💻
javascript
  • 자바스크립트 시작하기
  • 자바스크립트 기초 문법
  • 변수
  • 배열
  • 객체
  • 연산자
  • 조건문
    • if문
    • if ~else문
    • 다중 if문
    • 중첩 if문
    • switch문
    • 삼항 연산자
  • 반복문
    • while문
    • do while문
    • for문
    • 중첩 for문
    • break문
    • continue문
  • 함수
    • 선언적 함수
    • 익명함수
    • 매개변수가 있는 함수
    • arguments 함수
    • 리턴값이 있는 함수
    • 재귀함수
    • 콜백함수
    • 내부함수(스코프)
    • 객체 생성자 함수
    • 프로토타입 함수
    • 화살표 함수
    • 클래스
    • Promise
    • 템플릿 리터럴
  • 내장객체
    • String 객체
      • split()
      • join()
    • Number 객체
    • Date 객체
    • Array 객체
    • Math 객체
    • 정규표현 객체
  • 브라우저 객체
    • window 객체
    • navigator 객체
    • screen 객체
    • history 객체
    • location 객체
  • 문서객체
  • 이벤트
Powered by GitBook
On this page

Was this helpful?

  1. 함수

클래스

//클래스(es6) : 함수의 집합체
class Info6 {
    constructor(name, job){
        this.name = name;
        this.job = job;
    }
    study(){
        document.write("8. 내 이름은" + this.name +"이며, 직업은 " + this.job +"입니다.<br>");
    }
}
// + 인스턴스 객체 생성
const str7 = new Info6("웹쓰", "웹 퍼블리셔 취준생");
const str8 = new Info6("웹스로티보이", "프론트앤드 개발자");

// + 메서드 실행
str7.study();
str8.study();
//선언적 함수
function func1(){
    document.write("function1이 실행되었습니다.<br>");
}
func1();

//익명 함수
const func2 = function(){
    document.write("function2이 실행되었습니다.<br>");
}
func2();

//매개변수가 있는 함수
const func3 = function(name){
    document.write(name + "이 실행되었습니다.<br>");
}
func3("function3");

//리턴값(종료)이 있는 함수
function func4(){
    const str = "function4이 실행되었습니다.<br>";
    return str;
}
document.write(func4());

//즉시 실행 함수
(function(){
    document.write("function5이 실행되었습니다.<br>");
}());

//화살표 함수(선언적 함수)
func6 = () => {
    document.write("fucntion6이 실행되었습니다.<br>");
}
func6();

//화살표 함수(익명 함수)
const func7 = () => {
    document.write("fucntion7이 실행되었습니다.<br>");
}
func7();

//화살표 함수(매개변수가 있는 함수)
const func8 = (str) => {
    document.write(str + "이 실행되었습니다.<br>");
}
func8("function8");

//화살표 함수(리턴값이 있는 함수)
const func9 = () => {
    const str = "function9이 실행되었습니다.<br>";
    return str;
}
document.write(func9());

//객체 생성자 함수
function Func10(name, action){
    this.name = name;
    this.action = action;
    this.study = function(){
        document.write(this.name + "이 " + this.action + "되었습니다.<br>");
    }
}
const obj1 = new Func10("function10", "실행");
obj1.study();

//프로토타입 메서드
function Func11(name, action){
    this.name = name;
    this.action = action;
}
Func11.prototype.study = function(){
    document.write(this.name + "이 " + this.action + "되었습니다.<br>");
}
const obj2 = new Func11("function11", "실행");
obj2.study();

//클래스(es6)
class Func12 {
    constructor(name, action){
        this.name = name;
        this. action = action;
    }
    study(){
        document.write(this.name + "이 " + this.action + "되었습니다.<br>");
    }
}
const obj3 = new Func12("function12", "실행");
obj3.study();

클래스 상속

//클래스 상속
class Box1 {
    constructor(name, active){
        this.name = name;
        this.active = active;
    }
    study(){
        document.write(this.name + "이 " + this.active + "되었습니다.<br>");
    }
}        
class Box2 extends Box1 {
    constructor(name, active, today){
        super(name, active);
        this.today = today;
    }
    study2(){
        document.write(this.today + this.name + "이 " + this.active + "되었습니다.<br>");
    }
}  
const result4 = new Box1("함수9", "실행");
const result5 = new Box2("함수10", "실행", "오늘도");

result4.study();
result5.study();
result5.study2();
Previous화살표 함수NextPromise

Last updated 4 years ago

Was this helpful?