본문 바로가기

인터페이스 개발/javascript14

Javascript - 클래스 for ES6 클래스 for ES 6 class 정의 class 키워드 객체의 원형을 정의하는 키워드 ES6(ES2015)에서 추가 class 클래스명 { } 생성자 constructor() 함수로 정의 this 객체가 새로 생성됨 매개변수 지정 가능 class 클래스명 { constructor([매개변수]) { // this.를 이용하여 객체의 프로퍼티 정의 } } student.js // student class Student { constructor(name) { // 생성자를 constructor() 함수로 정의 this.name = name; } } var s1 = new Student("홍길동"); console.log(s1.name); 홍길동 프로토타입 메서드 class 블럭안에 정의되는 함수 functi.. 2020. 9. 21.
Javascript - 클래스 클래스 ES6은 더 간단하다. But. cross brousing을 위해! 객체와 배열을 사용한 데이터 관리 추상화 현실에 존재하는 객체의 필요한 속성을 추출하는 작업 학생의 성적 총점과 평균을 계산하는 예제 작성 객체와 배열을 사용한 데이터 관리 배열에 데이터 추가 객체와 배열을 사용한 데이터 관리 메서드 추가 객체와 배열을 사용한 데이터 관리 학생 성적 출력 함수를 사용한 객체 생성 객체의 반영 하나씩 만들어 배열에 사용 : 서로 다른 형태의 객체를 배열 안에 넣을 수 있는 장점 개별적 객체를 만드는 것이 객체의 특성을 정확히 반영 function makeStudent(name, korean, math, english, science) { var student = { name : name, korea.. 2020. 9. 21.
Javascript - 객체 객체 배열의 자료형 자바스크립트의 기본 자료형 숫자, 문자열, 불, 함수, undefined 객체의 타입 typeof [ ] → object 배열의 선언 var array = ['사과', '바나나', '망고', '딸기']; 배열의 선언 배열의 구성 : 인덱스와 요소 배열 요소를 사용하려면 배열 이름 뒤에 인덱스로 접근 배열의 인덱스와 요소 객체와 배열 배열은 객체를 기반으로 함 배열은 요소에 인덱스로 접근/객체는 요소에 키로 접근 //humanobject // 배열도 객체다. // 키를 인덱스로 접근하는 객체가 배열이다. // 키 part에 ""를 안붙여도 된다. (문자열로 본다.) var human = { name: "김상형", age: 29 }; console.log("name = " + human... 2020. 9. 21.
Javascript - 함수 함수 함수의 형식 함수란? 코드의 집합 함수의 정의 함수 호출 선언적 함수 선언적 함수 생성 함수 정의시 이름 배정 function fnName() { console.log('Hello javascript') } fnName(); Hello javascript 선언적 함수의 재정의 나중 정의된 것으로 결정 function fn() { console.log('Hello javascript 1') } function fn() { console.log('Hello javascript 2') } fn() Hello javascript 2 선언적 함수의 재정의 호출문이 선언문 앞에 올 수 있음 --> 호출 가능 fn2() // ? function fn2() { console.log('Hello javascript.. 2020. 9. 21.
Javascript - 배열 배열 배열 생성자 리터럴을 통한 생성 01_ intarray.js var ar = [1, 2, 5, 9, 15]; //var ar = new Array(1, 2, 5, 9, 15); for (var i = 0; i < ar.length; i++) { console.log("ar[" + i + "] =" + ar[i]); } 02_ arraylength.js var ar = ["태연", "유리", "윤아", "써니"]; for (var i = 0; i < ar.length; i++) { console.log("ar[" + i + "] =" + ar[i]); } 03_ arraymix.js var ar = [1234, "문자열", true, { name:"김상형", age:29 }]; for (var i =.. 2020. 9. 21.
Javascript - 예외처리 예외처리 예외처리 //trycatch // 예외 처리 console.log("실행을 시작합니다."); try { console.log(value); } catch(e) { console.log("예외가 발생했습니다."); console.log(e); } console.log("실행을 완료하였습니다."); 실행을 시작합니다. 예외가 발생했습니다. ReferenceError: value is not defined at Object. (c:\workspace\03_webclient\javascript\4\27_trycatch.js:5:17) at Module._compile (internal/modules/cjs/loader.js:1137:30) at Object.Module._extensions..js (i.. 2020. 9. 21.
Javascript - 반복문 반복문 배열이란? 여러 개의 변수를 한꺼번에 다룰 수 있는 자료형 객체 중 하나 대괄호([ ])로 생성 / 대괄호 사용 후 안에 쉼표로 구분해 자료를 입력 > var array = [273, 32, 103, 57, 52]; undefined > array [ 273, 32, 103, 57, 52 ] 배열 요소 다른 언어에서는 동일한 데이터 타입에 대해서 배열 생성 가능 자바스크립트는 어떠한 종류의 자료형도 배열 요소가 될 수 있음 자바스크립트의 모든 자료형을 넣을 수 있음 > var array = [ 273, // Number 'String' // String ,true, // Boolean function() {}, // Function {}, // Object [273, 103] // Array ];.. 2020. 9. 21.
Javascript - 조건문 조건문 if 조건문 자바스크립트에서 가장 일반적인 형태 불리언 표현식이 true면 문장 실행 false면 문장 무시 조건문에 의해 여러 문장을 실행핛 때는 중괄호로 감싸야 함 //ifcondition var num = 14; if (num % 2 == 0) console.log(num + "는 짝수입니다."); // 한 줄만 {} 생략가능 var num = 4; if (num % 2 == 0) { console.log(num + "는 짝수입니다."); console.log("짝수는 2로 나누어 떨어지는 수입니다."); } var num = 4; if (num % 2 == 0) console.log(num + "는 짝수입니다."); console.log("짝수는 2로 나누어 떨어지는 수입니다."); 14는.. 2020. 9. 21.
Javascript - 비교 연산자 비교 연산자 비교 연산자 "9"==9 → 9==9 → True 일치 연산자 자료형이 다른 것을 확실하게 구분 짓고 싶을 때 사용 예제 코드의 결과는 모두 false 일치 연산자의 용도 자료형이 다른 것을 확실하게 구분 짓고 싶을 때 사용 > '' == false true > '' === false false > '' == 0 true > '' === 0 false > '273' == 273 true > '273' === 273 false 문자열 비교 다른 데이터 타입의 비교 동일 데이터 타입으로 변환한 후 비교 //stringcompare console.log('"korea" > "america" : ' + ("korea" > "america")); console.log('"Korea" > "americ.. 2020. 9. 21.
Javascript - 기본 연산자 기본 연산자 복합 대입 연산자 대입 연산자와 다른 연산자를 함께 사용하는 연산자 증감 연산자 복합 대입 연산자를 간략하게 사용한 형태 단항 연산자 양수를 음수로 바꾸거나 음수를 양수로 바꾸는 -기호 -52 -(-52) + : 부호 유지 typeof 연산자 data type 문자열로 출력 typeof 52 number typeof(typeof 52) string typeof 연산자의 괄호 사용 typeof 1 + '문자열' typeof(1 + '문자열') typeof(1) + '문자열' 이항 연산자 양쪽에 항을 써서 사용 : + 연산자/*연산자 다항 연산자가 이항 연산자보다 우선순위가 높다. 자료형을 출력하는 예제 코드 undefined 정의하지 않은 자료형 의미 선언하지 않은 식별자 alpha 사용 > .. 2020. 9. 21.
Javascript - 타입 변환 타입 변환 암시적 변환 연산자 문자열이 우선 문자열이 아닌 타입 → 문자열 다른 연산자 숫자가 우선 숫자 이외의 타입 → 숫자 //implicit var name = "김상형 : "; var score = 98; console.log(name + score); var value1 = "8"; var value2 = "6"; var add = value1 + value2; console.log("add : " + add); var sub = value1 - value2; console.log("subtract : " + sub); console.log(name - score); // 문자열을 숫자로 김상형 : 98 add : 86 subtract : 2 NaN 명시적 변환 Number() 숫자 이외의 값이.. 2020. 9. 21.
Javascript - 변수 변수 변수 변수 값을 저장할 때 사용하는 식별자 숫자뿐만 아니라 모든 자료형 저장 가능 변수의 사용 과정 변수 선언 (var 키워드 사용) var a; 변수 초기화 (처음 값을 할당) var a = 12; 연속 선언 var a, b=3, c; //var var a = 12; var b = "korea"; var c console.log("a = " + a); console.log("b = " + b); console.log("c = " , c); console.log("d = " , d); a = 12 b = korea c = undefined c:\workspace\03_webclient\javascript\2\03_var.js:7 console.log("d = " , d); ​ ^ ReferenceE.. 2020. 9. 21.

티스토리툴바