Lpla 개발 블로그

etc

VSCode JQuery 코드힌트 안보이는 문제 해결

어느날부터 집에 설치된 VSCode에서 자바스크립트 코드힌트가 나오지 않았다. 아니, 자세히 살펴보니 자바스크립트는 문제 없었고 제이쿼리 코드힌트가 나오지 않았다. 문제 해결방법은 VSCode 터미널에 다음 명령어를 입력하면 된다. npm install @types/jquery --save 타입스크립트에서 제이쿼리를 사용하는 방법이라고 한다. ......난 타입스크립트를 쓸 줄 모르는데 뭘까? 예전에 node.js와 eslint를 설치하면서 문제가 생긴 모양이다. 결과적으로 제이쿼리 코드힌트가 아주 잘 보인다. 그런데 이번에는 제이쿼리 문법에 취소선이 생겼다. 실행은 문제없이 되지만 매우 거슬리는 관계로 없애는 방법을 찾아봤다. 원인은 on()이나 trigger() 방식을 사용하지 않아서였다. 그런데 j..

일상

입사 1년차

2018년 7월 웹디자인 공부를 시작하고 2018년 10월 웹코딩 공부를 시작했다. 긴 과정을 거쳐 2019년 7월 웹퍼블리셔로 첫 입사를 하고 이번 7월에 드디어 입사 1년차가 되었다. 사원수 50명 규모의 웹에이전시에 이력서를 넣고 면접을 보면서 자신감도 많이 얻었지만 부족한 부분도 알게 됐다. 결과는 당연히 최종 합격이었지만 이직을 할지, 지금 회사에 남아 부족한 부분을 채우며 공부를 이어 나갈지는 확신이 안 선다. 그래도 차근차근 성장하고 있는 모습을 스스로도 느낄 수 있어 좋았고 에이전시에서 원하는 인재상도 확인할 수 있어 만족한다.

JavaScript/기초

[JavaScript] 생성자 함수

자바스크립트 코드를 짜다 보면 비슷한 객체를 여러개 만들어야 하는 경우가 많다. 이 때 new 연산자와 생성자 함수를 이용할 수 있다. 생성자 함수는 일반 함수와 기술적으로 차이가 없기 때문에 이를 구별하기 위해 다음과 같은 규칙을 정해두고 있다. 함수의 첫 글자는 대문자 new와 함께 호출 function Member(name) { this.name = name; this.age = 29; } let member = new Member("Jin"); alert(member.name); // Jin alert(member.age); // 29 위 코드의 작동 원리는 다음과 같다. function Member(name) { // this = {}; 빈 객체가 임시로 만들어진다. // 새로운 프로퍼티를 th..

JavaScript/기초

[JavaScript] this (1)

자바스크립트에서 this는 매우 유연하게 쓸 수 있다. 메서드 내부에서 this를 사용하면 객체에 접근할 수 있다. let Jin = { 'name' : 'Jin', sayHello() { alert(this.name + " 안녕하세요."); } } let Yumi = { 'name' : 'Yumi', sayHello() { alert(this.name + " 안녕하세요."); } } Jin.sayHello(); // Jin 안녕하세요. Yumi.sayHello(); // Yumi 안녕하세요. 하지만 위 코드는 sayHello()가 Jin과 Yumi에 중복 작성되었기 때문에 깔끔하지 않다. 다음처럼 줄여 쓸 수 있다. let Jin = {'name' : 'Jin',} let Yumi = {'name' :..

JavaScript/기초

[JavaScript] 프로퍼티와 메서드와 리터럴

자바스크립트 공부를 하다 보니 프로퍼티와 메서드, 리터럴이라는 용어를 자주 접한다. 이를 짧게 정리해보았다. 프로퍼티 : 키(Key)와 값(Value)로 이루어진 객체(Object)의 일부 let member = { 'name' : 'Jin', 'age' : 30, 'country' : 'italy' } member는 객체 'name', 'age', 'country' 는 키 'Jin', 30, 'italy' 는 값 'name' : 'Jin', 'age' : 30, 'country' : 'italy' 는 프로퍼티이다. let member = { 'name' : 'Jin', 'age' : 30, 'country' : 'italy', sayHello() { alert("안녕하세요."); } } member.s..

JavaScript/기초

[JavaScript] 객체 (2)

계산된 프로퍼티 let color = prompt("색상을 정하세요."); let select = { [color]: "좋아요.", // 변수 fruit에서 프로퍼티 이름을 동적으로 받아 옵니다. }; alert( select.blue ); // color에 "blue"이 할당되었다면, 5가 출력됩니다. 단축 프로퍼티 function info(name, age) { return { name, // name : name 과 같다. age // age : age 와 같다. }; } let user = info("Jin", 29); alert(user.name); // Jin 프로퍼티 조회 let user = { name: "Jin", age: 29, region: "Seoul", gender: "Man" }..