VSCode로 자바스크립트를 연습하고 있는데

자신이 원하는 에러 메시지(변수 재선언할 경우, 세미콜론을 꼭 붙이도록 할 경우 등)를

에디터가 출력하게 하고 싶은 경우가 있다

기본적으로 JS의 경우 위의 에러 메시지를 잡아주지 않아서

확장기능을 설치해서 사용한다



1. VSCode 확장기능에서 ESLint를 설치



2. 노드js 설치

https://nodejs.org/




3. "Ctrl + ~"로 터미널 실행


터미널에서 아래 명령어 입력


npm install -g eslint




4. package.json 생성


계속 터미널에서 명령어를 입력


npm init


입력을 요구하는데 쭉 엔터로 넘어가고

마지막에 yes입력


그러면 기본값으로 package.json파일이 생성




5. .eslintrc.js 생성


터미널에서 마지막으로 명령어 입력


eslint --init


어떤 설정을 사용할 것인지 물어본다

자신이 사용하는 것을 위주로 선택(수정가능하니 부담x)


중간에 설치 질문 나오는 것 yes


설치를 종료하고 나면 ".eslintrc.js"파일이 생성된다

이 파일에 자신이 원하는 규칙을 

rules에 입력하면 된다.


규칙들은 ESLint 사이트 참조

https://eslint.org/docs/rules/




6. settings.json 수정


1) F1키 눌러서 기본 설정 클릭




2) setting를 치고 스크롤을 내리다보면 보이는

settings.json에서 편집하기 클릭




3) settings.json 파일에 아래 설정 저장

    자신이 사용하는 언어가 있으면 추가하면 됨


"eslint.validate": [
{"language": "javascript"},
{"language": "html"},
],



4) .eslintrc.js 파일 수정(자신이 최근에 사용하던 폴더에 생성되어 있음)

    저는 아래와 같이 설정


"extends": "eslint:recommended",
"rules": {
"indent":[
"error",
4
],
"no-unused-vars": 1,
"no-use-before-define": 1,
"no-redeclare": 1,
"no-console":0,
}



5) "*.js"파일에서 코드 작성

   아래 문제창에서 에러 메시지 출력



저작자표시 비영리 변경금지

객체는 새로운 값을 가진 프로퍼티를 생성하고

생성된 프로퍼티에 접근해서 해당 값을 읽거나

원하는 값으로 프로퍼티를 갱신할 수 있다.


객체의 프로퍼티에 접근하려면 마침표나 대괄호를 사용한다.

대괄호 표기법에서는 접근하려는 프로퍼티의 이름을

문자열의 형태로 만든다.


객체 프로퍼티 읽기


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 읽기
//마침표 표기
console.log(obj.name);//-> Gil-dong
//대괄호 표기
console.log(obj['name']);//-> Gil-dong
//gender라는 객체가 없으므로
console.log(obj.gender);//-> undefined


객체 프로퍼티 갱신


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 갱신
//age의 기존 값을 변경
obj.age = 25;
console.log(obj.age);//-> 25
console.log(obj['age']);//-> 25


객체 프로퍼티 동적 생성


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 동적 생성
//객체가 생성된 후에도 프로퍼티를 생성해서 객체에 추가할 수 있다.
//gender라는 프로퍼티를 생성 후 male이라는 값을 추가.
obj.gender = 'male';
console.log(obj.gender);//-> male


객체 프로퍼티 삭제


//객체 프로퍼티 삭제
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};

console.log(obj.gender);//-> male
//gender 프로퍼티 삭제
delete obj.gender;
console.log(obj.gender);//-> undefined

//obj 객체 삭제
delete obj;
console.log(obj.name);//-> Gil-dong
//delete연산자는 객체를 삭제하지 못한다.


대괄호 표기법만 사용해야 하는 경우


var obj = {
name : 'Gil-dong',
age : 30
};

//대괄호 표기법만 사용해야 하는 경우
//접근하려는 프로퍼티가 표현식이거나 예약어일 경우 사용
//아래와 같이 phone-number은 '-'가 있는 표현식
obj['phone-number'] = '010-1111';
console.log(obj['phone-number']);


객체 내 모든 프로퍼티 출력


//for in문을 사용하면 객체에 포함된
//모든 프로퍼티에 대해 반복 수행 가능

//객체 리터럴을 이용한 obj 객체 생성
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};

//prop 변수 선언
var prop;

//prop변수에 obj객체의 프로퍼티가 하나씩 할당
for(prop in obj){
//prop에 할당된 프로퍼티 이름을 이용
//대괄호 표기법을 사용하여 값을 출력
console.log(prop, obj[prop]);
}


저작자표시 비영리 변경금지

'프로그래밍 > JavaScript' 카테고리의 다른 글

참조 타입 객체 생성  (0) 2019.03.12
자바스크립트 기본 타입  (0) 2019.03.11

객체 : 키(key)와 값(value)의 쌍들을 저장하는 컨테이너


속성(Property) : 키와 값의 한 쌍

1) 언제든지 추가하거나 삭제가 가능.

2) 값으로 다른 객체의 참조를 가질 수 있다. 

3) 값으로 함수 객체를 가질 수도 있는데 이 속성을 메서드라 부른다


객체를 생성하는 방식

1) 객체 생성자 함수

2) 객체 리터럴

3) 생성자 함수



//생성자 함수를 사용한 객체 생성
//Object의 O는 대문자임을 주의
var obj = new Object();

//obj 객체 속성(property) 생성
obj.name = 'Gil-dong';
obj.age = 30;
obj.gender = 'male';

//obj 객체의 타입
console.log(typeof obj);//-> object 타입
//obj 객체의 속성 출력
console.log(obj);//-> 객체의 키와 값의 형태로 출력


//리터럴 : 표기법
//객체 리터럴 : 객체를 생성하는 표기법을 의미
//객체 리터럴 방식 obj 객체 생성
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};
// {}로 객체를 생성하며 아무것도 적지 않으면 빈 객체가 생성
// "속성 이름" : "속성 값"형태로 표기

console.log(typeof obj);//-> object 타입
console.log(obj);//-> 객체의 키와 값의 형태로 출력

//생성자 함수 사용 추후..


저작자표시 비영리 변경금지

'프로그래밍 > JavaScript' 카테고리의 다른 글

객체 프로퍼티  (0) 2019.03.12
자바스크립트 기본 타입  (0) 2019.03.11

+ Recent posts

티스토리툴바