[JavaScript] 자바스크립트에서 fetch()로 텍스트 데이터 읽어오기

226_자바스크립트에서 fetch()로 텍스트 데이터 읽어오기 [적용] 데이터를 가져오고 싶을 때 [문법] 메소드 의미 반환 fetch(URL) URL로 데이터 가져오기 Promise [내용] fetch()를 사용하면 간단하게 외부 파일을 가져올 수 있다. 프로그램에서는 데이터 다운로드의 시간 예측이 불가능하므로 Promise의 then()을 사용해 비동기로 처리한다. fetch()로 데이터를 가져온 뒤 then()을 호출한다. 이것이 데이터를 읽어 오는 첫 번째 단계로, 샘플코드의 (1)과 같다. 네트워크에서 가져온 데이터는 다양한 형식이 있으므로 데이터를 프로그램의 목적에 맞게 해석해야 한다. 샘플에서는 텍스트 형식의 데이터를 사용하므로 (1)에서 가져온 데이터를 text()를 사용해 해석하고 이 결..

2022.08.01

[JavaScript] 자바스크립트에서 JSON 변환 기능 커스터마이징

225_자바스크립트에서 JSON 변환 기능 커스터마이징 [적용] 일부 데이터만 JSON 변환 작업을 하고 싶을 때 [문법] 메소드 의미 반환 JSON.stringify(obj, replacer, space*) 일부 데이터를 JSON 문자열로 변환 문자열 [내용] JSON.stringify()의 두 번째 인수는 replacer 함수를 호출하며, 이 함수는 JSON 데이터 변환 룰을 설정할 수 있다. 예를 들어, 숫자인 경우 작업을 무효화하고 문자열인 경우에만 변환 작업을 실행하록 지정할 수 있다. JavaScript main.js const replacer = (key, value) => { // 숫자 형식을 처리 예외 if (typeof value === 'number') { return undefine..

2022.08.01

[JavaScript] 자바스크립트에서 JSON 변환에 들여쓰기 적용하기

224_자바스크립트에서 JSON 변환에 들여쓰기 적용하기 [적용] 자바스크립트 객체를 JSON 문자열로 변환하고 싶을 때 가독성을 위해 JSON에 들여쓰기를 적용하고 싶을 때 [문법] 메소드 의미 반환 JSON.stringify(obj, null, ' ') 들여쓰기를 적용해 객체를 JSON 문자열로 변환 문자열 [내용] JSON.stringify()의 세 번째 인수는 JSON 문자열의 줄바꿈과 들여쓰기 삽입을 위해 사용한다. 들여쓰기 삽입을 위한 문자열을 지정하거나 숫자를 전달하면 숫자만큼의 공백이 삽입된다. 다음 예시를 확인해 보자. JavaScript main.js const data = {a: 1000, b: '여러분 안녕하세요.'}; const str = JSON.stringify(data, nu..

2022.08.01

[JavaScript] 자바스크립트에서 객체를 JSON 변환하기

223_자바스크립트에서 객체를 JSON 변환하기 [적용] 자바스크립트의 객체를 JSON 문자열로 변환하고 싶을 때 [문법] 메소드 의미 반환 JSON.stringify(obj) 자바스크립트 객체를 JSON 문자열로 변환 문자열 [내용] JSON.stringify()를 사용해 자바스크립트의 객체를 JSON 문자열로 변환할 수 있으며, 인수에는 객체를 전달한다. JavaScript main.js const data = {a: 1000, b:'여러분 안녕하세요.'}; const str = JSON.stringify(data); console.log(str); // 결과: { "a": 1000, "b": "여러분 안녕하세요." } 참조 : 실무에 바로 적용하는 자바스크립트 코드레시피 278 아케다 야스노부, 카..

2022.08.01

[JavaScript] 자바스크립트에서 JSON 문자열 객체로 변환하기

222_자바스크립트에서 JSON 문자열 객체로 변환하기 [적용] JSON의 문자열을 자바스크립트의 객체에서 사용하고 싶을 때 네트워크에서 받은 JSON 문자열을 사용하고 싶을 때 [문법] 메소드 의미 반환 JSON.parse(문자열) JSON 형식의 문자열을 JSON 객체로 변환 객체 [내용] JSON.parse()를 사용해 JSON 문자열을 해석하고 자바스크립트의 값과 객체로 변환한다. JSON.parse()로 변환한 문자열은 자바스크립트의 객체로 처리되므로 마침표(.)를 사용해 참조할 수 있다. JavaScript main.js // JSON 문자열 const jsonString = `{ "students": 40, "grade": 4, "name": "C반" }`; // 문자열을 자바스크립트의 객체..

2022.08.01

[JavaScript] 자바스크립트 JSON 알아보기

221_자바스크립트 JSON 알아보기 [적용] 네트워크로 데이터를 송수신하고 싶을 때 데이터를 정의하고 싶을 때 [내용] JSON은 범용적인 데이터 형식이다. 서버와의 통신이나 데이터의 외부 파일 저장 등에 사용한다. JSON은 자바스크립트뿐만 아니라 PHP나 자바(Java) 등 다른 언어에서도 사용된다. JSON은 텍스트 에디터로 편집이 가능하며, 자바스크립트로 불러오기가 쉽고 다양한 구조의 데이터도 유연하게 사용할 수 있는게 장점이다. JSON 파일의 구조를 확인하기 위해 다음과 같이 각 학급 정보를 JSON 데이터로 정의한다고 가정해 보자. 학생이 40명인 4학년 C반의 정보는 다음과 같이 정의한다. JSON JSON의 구조와 데이터의 예 { "students": 40, "grade": 4, "na..

2022.07.31