전체 글89

• 2022 1월 셋째주 https://hianna.tistory.com/462 [Javascript] 빈 객체 체크하는 3가지 방법 Javascript에서 빈 객체를 체크하는 방법입니다. Object.keys() 함수 반복문 사용하기 lodash library 사용하기 1. Object.keys() 함수 function isEmptyObj(obj) { if(obj.constructor === Object && Object.keys.. hianna.tistory.com https://kamang-it.tistory.com/entry/JavaScript15%EC%9C%A0%EC%82%AC%EB%B0%B0%EC%97%B4-%EA%B0%9D%EC%B2%B4Arraylike-Objects [JavaScript-15]유사배열 객체(Arr.. diary 2022. 1. 17.

• 

  [Java] 인터페이스(interface) 자바에서 인터페이스(interface)는 객체의 사용 방법을 정의한 타입입니다. 인터페이스는 객체의 교환성을 높혀주기 때문에 다형성을 구현하는 매우 중요한 역할을 합니다. 특시 자바8에서 인터페이스의 중요성은 더욱 커졌습니다. 자바8의 람다식은 함수적 인터페이스의 구현 객체를 생성하기 때문입니다. 인터페이스(interface)는 개발 코드와 객체가 서로 통신하는 접점 역할을 합니다. 개발 코드가 인터페이스의 메소드를 호출하면 인터페이스는 객체의 메소드를 호출시킵니다. 그렇기 때문에 개발 코드는 객체의 내부 구조를 알 필요가 없고 인터페이스의 메소드만 알고 있으면 됩니다. 개발 코드가 직접 객체의 메소드를 호출하면 간단한데, 왜 중간에 인터페이스를 두는지 의문점이 생깁니다. 그 이유는 개발 코드를 수정하지.. java 2022. 1. 16.

• 

  [Javascript] 열거형 Enum Javascript 에서 enum을 사용하기 Enum Enum은 enumerated type의 줄임말입니다. 말 그대로 열거하는 타입이라는 의미를 가집니다. 무엇을 열거한다는 것일까요? 상수 값 중에서 비슷한 종류들을 묶어두기 위한 용도로 자주 사용됩니다. 자바스크립트에서의 enum 타입은, 고유한 타입이 아닙니다. 자바에서는 enum 타입을 제공하지만, 자바스크립트에서는 정의되어 있지 않습니다. 하지만 이 자료형과 조금이나마 비슷하게 작동할 수 있는 데이터를 자바스크립트에서도 간단하게 만들 수 있기 때문에 정리해보았습니다. (타입으로 정의되어 제공하는 언어들보다는, 훨씬 기능이 적을 수 밖에 없습니다.) Enum을 사용하는 이유? 위에서 언급한 듯이, 상수 값을 모아두고 써야 할 때 유용합니다. enu.. javascript 2022. 1. 14.

• 

  [Javascript] fetch 자바스크립트를 사용하면 필요할 대 서버에 네트워크 요청을 보내고 새로운 정보를 받아오는 일을 할 수 있습니다. 네트워크 요청은 다음과 같은 경우에 이뤄집니다. 주문 정보 사용자 정보 읽기 서버에서 최신 변경분 가져오기 etc.. 그런데 이 모든 것들은 페이지 새로 고침 없어도 가능합니다. AJAX(Asynchronous Javascript And XML, 비동기적 Javascript와 XML)라는 용어를 들어보았을 겁니다. AJAX는 서버에서 추가 정보를 비동기적으로 가져올 수 있게 해주는 포괄적인 기술을 나타내는 용어로, 만들어진지 오래되었습니다. AJAX 이외에도 서버에 네트워크 요청을 보내고 정보를 받아올 수 있는 방법은 다양합니다. 이번에는 fetch() 메서드에 대해 글을 작성해보았습니다. fe.. javascript 2022. 1. 13.

• 

  [IntelliJ] springboot initializr 가 없을 때 한동안 프론트앤드만 하다가 업무에 사용될 툴을 익히고 잊었던 감을 익히기 위해서.. 인텔리제이를 설치하게 되었고, springboot를 생성하려고 했는데 검색해서 찾아본 것과 비교하면 내 것에는 springboot initializr이 없었다...! 플러그인에서 Spring-boot plugins 를 다운받으면 된다고 나와있어서 찾아봤는데 역시 없다... 구글링을 해본 결과로는 , IntelliJ IDEA Community 버전에서는 지원을 하지 않는다는 것 이었습니다. (회사 이메일로 가입을 하면 Ultimate 버전을 제공해준다고 한거 같은데... 나중에 다시 알아봐야 할 거 같네용) 그래서 결론은, https://start.spring.io/ 위 링크로 접속을 해서 만들고자 하는 프로젝트의 자바 버.. java 2022. 1. 12.

• 

  [Javascript] 'try...catch'와 에러 핸들링 'try...catch'와 에러 핸들링 보통의 스크립트에서 에러가 발생하면 스크립트가 죽고(즉시 중단되고), 콘솔에 에러가 출력됩니다. 그러나 try...catch문법을 사용하면 스크립트가 죽는 걸 방지하고, 에러를 잡아서(catch) 더 합당한 무언가를 할 수 있게 됩니다. 'try...catch' 문법 try{ // 코드 }catch (err){ // 에러 핸들링 } try...catch 동작 알고리즘은 다음과 같습니다. 먼저, try{...} 안의 코드가 실행됩니다. 에러가 없다면, try 안의 마지막 줄까지 실행되고, catch 블록은 건너뜁니다. 에러가 있다면, try 안 코드의 실행이 중단되고, catch(err) 블록으로 제어 흐름이 넘어갑니다. 변수 err(아무이름이나 사용 가능)는 무슨 .. javascript 2022. 1. 11.

• 

  [Javascript] label(레이블) 구문 레이블 구문은 break 나 continue 구문과 함께 사용할 수 있습니다. 원하는 식별자로 구문 앞에 레이블을을 추가할 수 있습니다. 문법 label : statement label : 자바스크립트에서 사용할 수 있는 식별자면 모두 가능합니다. statement : 구문. break는 모든 레이블 구문에서 사용될 수 있으며, continue는 반복 레이블 구문에서만 사용할 수 있습니다. 반복문에 레이블을 붙이고, break나 continue 구문을 사용해 반복문의 어느 위치에서 작업을 멈추고 어느 위치에서 다시 수행할지를 알려줄 수 있습니다. 자바스크립트에는 goto문이 없다는 것에 주의해야 하며, break나 continue에서만 레이블을 사용할 수 있습니다. strict mode코드에서 "let".. javascript 2022. 1. 11.

• 

  [Javascript] JSON stringify 사용법, parse 사용법(JSON과 메서드) JSON(JavaScript Object Notation)은 값이나 객체를 나타내주는 범용 포맷으로, RFC 4627 표준에 정의되어 있습니다. JSON은 본래 자바스크립트에서 사용할 목적으로 만들어진 포맷입니다. 그런데 라이브러리를 사용하면 자바스크립트가 아닌 언어에서도 JSON을 충분히 다룰 수 있어서, JSON을 데이터 교환 목적으로 사용하는 경우가 많습니다. 자바스크립트가 제공하는 JSON 관련 메서드는 다음과 같습니다. JSON.stringify - 객체를 JSON으로 바꿔줍니다. JSON.parse - JSON을 객체로 바꿔줍니다. JSON.stringify let student = { name:'John', age: 30, isAdmin: false, courses: ['html','css'.. javascript 2022. 1. 10.

• 

  [Javascript] ... 사용 방법 [구조 분해 할당 (배열, 객체 분해하기)] 객체와 배열은 자바스크립트에서 가장 많이 쓰이는 자료 구조입니다. 함수에 객체나 배열을 전달해야 하는 경우가 생기곤 합니다. 가끔은 객체나 배열에 저장된 데이터 전체가 아닌 일부만 필요한 경우가 있습니다. 이럴 때 객체나 배열을 변수로 '분해' 하는 특별한 문법인 구조 분해 할당 (destructiong assignment)을 사용 할 수 있습니다. 이 외에도 함수의 매개변수가 많거나 매개변수 기본값이 필요한 경우 등에서 구조 분해는 그 진가를 발휘합니다. 배열 분해하기 // 이름과 성을 요소로 가진 배열 let arr = ["sewon", "jang"]; // 구조 분해 할당을 이용해 firstName엔 arr[0]을, surName엔 arr[1]을 할당하였습니다. let [firstName, surN.. javascript 2022. 1. 10.

• 

  [javascript] 화살표 함수 (()=>, Arrow Function) 화살표 함수? this를 가지지 않습니다. arguments를 지원하지 않습니다. new와 함께 호출할 수 없습니다. super가 없습니다. 화살표 함수(Arrow function)는 function 키워드 대신 화살표(=>) 를 사용하여 보다 간략한 방법으로 함수를 선언할 수 있습니다. 하지만 모든 경우 화살표 함수를 사용할 수 있는 것은 아닙니다. // 매개변수 지정 방법 () => { ... } // 매개변수가 없을 경우 x => { ... } // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다. (x, y) => { ... } // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다. // 함수 몸체 지정 방법 x => { return x * x } // single line block x.. javascript 2022. 1. 9.

• 

  [javascript] Symbol Symbol은 ES6에서 샐옵게 추가된 7번째 타입으로 변경 불가능한 원시 타입의 값입니다. 심볼은 주로 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키(property key)를 만들기 ㅜ이해 사용합니다. Symbol의 생성 Symbol은 Symbol()함수로 생성됩니다. Symbol() 함수는 호출될 때 마다 Symbol 값을 생성합니다. 이 때 생성된 Symbol은 객체가 아니라 변경 불가능한 원시 타입의 값입니다. // 심볼 mySymbol은 이름의 충돌 위험이 없는 유일한 프로퍼티 키 let mySymbol = Symbol(); console.log(mySymbol); // Symbol() console.log(typeof mySymbol); //'symbol' Symbol() 함수는 Str.. javascript 2022. 1. 8.

• 

  [javascript] 옵셔널 체이닝 '?.' 옵셔널 체이닝(optional chaining) ?. 을 사용하면 프로퍼티가 없는 중첩 객체를 에러 없이 안전하게 접근할 수 있습니다. 옵셔널 체이닝이 필요한 이유 먼저, 옵셔널 체이닝이 등장했는지 몇가지의 예시가 있습니다. 사용자가 여러 명 있는데 그 중 몇명은 주소 정보를 가지고 있지 않다고 가정해봅시다. 이럴 때 user.address.street를 사용해 주소 정보에 접근하면 에러가 발생할 수 있습니다. let user = {}; // 주소 정보가 없는 사용자 alert(user.address.street); // TypeError: Cannot read property 'street' of undefined 또 다른 사례로는 브라우저에서 동작하는 코드를 개발할 때 발생할 수 있는 문제가 있습니다.. javascript 2022. 1. 7.