개발24 jquery json을 form으로, form을 json으로 // 테스트 html 코드 이름: 이메일: 나이: JSON으로 변환 1. json -> form form 데이터를 forEach 문으로 돌려서 json에 넣어 주었다. 결과는 아래와 같이 나온다. { "name": "John", "email": "john@example.com", "age": "25" } 2. json -> form // 가상의 JSON 데이터 예시 var jsonData = { name: "John Doe", email: "john@example.com", age: 25 }; // JSON 데이터를 폼에 설정 $.each(jsonData, function(key, value) { $('form#detail [name=' + key + ']').val(value); }); 마찬가지로 js.. 2024. 1. 13. data attribute와 dataset 노드를 웹 서버로 사용하는 경우, 클라이언트(프런트엔드)와 빈번하게 데이터를 주고받게 됩니다. 이때 서버에서 보내준 데이터를 프런트엔드 어디에 넣어야 할지 고민이 됩니다. 프런트엔드에 데이터를 내려보낼 때 첫 번째로 고려해야 할 점은 보안입니다. 클라이언트를 믿지 말라는 말이 있을 정도로 프런트엔드에 민감한 데이터를 내려보내는 것은 실수입니다. 비밀번호 같은 건 절대 내려보내지 않도록 합시다. 보안과 관련이 없는 데이터들은 자유롭게 프런트엔드로 보내도 됩니다. 자바스크립트 변수에 저장해도 되지만 HTML5에도 HTML과 관련된 데이터를 저장하는 공식적인 방법이 있습니다. 바로 data attribute입니다. Zero Nero Hero Kero 위와 같이 HTML 태그의 속성으로, data-로 시작하는 .. 2024. 1. 7. ES2015+(async, await) 지난번 promise에 이어 이번에는 async/await에 대한 포스팅을 하겠습니다. 7. async/await 노드 7.6 버전부터 지원되는 기능입니다. 자바스크립트 스펙은 ES2017입니다. 최신 기능이면서 정말 혁신적인 기능입니다. 특히 노드처럼 비동기프로그래밍을 해야 할 때 도움이 많이 됩니다. 프로미스가 콜백 지옥을 해결했다지만, 여전히 코드가 장황합니다. async/await 문법은 프로미스를사용한 코드를 한 번 더 깔끔하게 줄여줍니다. 프로미스 코드를 다시 한 번 보겠습니다. function findAndSaveUser(Users) { Users.findOne({}) .then((user) => { user.name ='zero'; return user.save(); }) .then((us.. 2024. 1. 7. ES2015+(Promise) 6. 프로미스 자바스크립트와 노드에서는 주로 비동기 프로그래밍을 합니다. 특히 이벤트 주도 방식 때문에 콜백 함수를 자주 사용합니다. ES2015부터는 자바스크립트와 노드의 API들이 콜백 대신 프로미스(Promise) 기반으로 재구성됩 니다. 그래서 악명 높은 콜백 헬(callback hell)을 극복했다는 평가를 받고 있습니다. 프로미스는 다음과 같은 규칙이 있습니다. 먼저 프로미스 객체를 생성해야합니다. const condition = true; // true면 resolve, false면 reject const promise = new Promise((resolve, reject) => { if (condition) { resolve('성공'); } else { reject('실패'); } });.. 2024. 1. 7. 이전 1 2 3 4 5 6 다음