본문 바로가기
반응형

Programming Language/Javascript48

[Javascript] form 데이터를 확인하고 싶다면? 클라이언트에서 form을 작성하고 서버에 전달할 때 종종 에러가 발생하는 경우가 있습니다.개발자는 그때 클라이언트 문제인지, 서버 문제인지 확인하는데요.만약 클라이언트 문제라면, 그리고 내가 전달하고자 하는 form 데이터에 문제가 있는 것 같다면?form 데이터 내용을 어떻게 확인할 수 있을까요? javascript를 사용하는 개발자라면 다음 코드를 사용하시면 됩니다.결과는 alert 통해 확인해도 되고, 개발자 도구를 통해 확인해도 됩니다.  검사하고 싶은 form//검사하고 싶은 formlet formData = new FormData($('#my_form')[0]); form 데이터 내용 확인//form 데이터 내용 확인for (let pair of formData.entries()) { con.. 2024. 7. 3.
[Javascript] 자바스크립트 기초, 등차수열 구하기 등차수열은 연속된 수들의 차이가 일정한 수열을 말해요. 등차수열을 구하고 싶다면 공차라는 개념을 알아야 해요. 공차(common difference)는 연속된 항의 뒤 항에서 앞 항을 뺀 값을 말해요. 예시를 들어볼까요? 첫 번째 항이 7이고 공차가 1이면, 해당 등차수열은 7, 8, 9, 10 ... 과 같습니다. 자바스크립트로 등차수열을 구하고 싶다면 다음 코드를 쓰면 되요. function arithmetic_sequence(a, d, n) { let sequence = []; for (let i = 0; i < n; i++) { sequence.push(a + i * d); } return sequence; } 자바스크립트에서는 배열과 반복문을 사용해서 수학적 계산을 하는데요. 만약 파이썬에서 등.. 2024. 3. 1.
[Javascript] 문자열내 알파벳, 대소문자를 소대문자로 치환하려면? 자바스크립트는 파이썬과 달리 영대소문자를 영소대문자로 치환할 수 있는 메서드가 없어, 직접 순회하면서 치환해 주어야 한다고 합니다. 소스 코드는 다음과 같습니다. //sample이라는 문자열 순회 방법 let sample = 'abcDEF'; for (let i = 0; i < sample.length; i++) { let one = sample[i]; if (one === one.toUpperCase()) { swapped += one.toLowerCase(); } else { swapped += one.toUpperCase(); } } 파이썬의 경우 swapcase() 함수를 쓰면 되는데 아쉽습니다. *이전글 https://dothewillof.tistory.com/427 [Python] 파이썬으로 .. 2024. 2. 21.
[Javascript] 정규표현식으로 url 검증하기 정규 표현식을 통해 웹 주소의 유효성 중, 다음 아래와 같은 내용을 검증할 수 있습니다. 1. 프로토콜 (http, https) 2. 도메인 3. 선택적 경로를 포함한 URL 유효성 /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/ ^ 문자열의 시작을 나타냅니다 (https?:\/\/)? https? : 'http'로 시작하며, 's'는 선택적입니다. 이는 URL이 'http' 또는 'https' 중 하나로 시작할 수 있음을 의미합니다. :\/\/: ' : //' 문자열을 나타냅니다. 문자열 내에서 특수 문자 :와 /는 이스케이프 처리되어야 하므로 \를 사용합니다. 전체 괄호 () 뒤에 오는 ?는 이 전체 부분(프로토콜과 ://)이 선택적.. 2024. 2. 20.
[Javascript] lazy loading, 이미지 로딩 시 부드럽게 표현하기 이미지 로딩 시간이 길면 구글 검색 알고리즘에 영향을 미칠 수 있다는 글을 보았습니다. 페이지에 이미지 렌더링 하는 시간을 어떻게 줄일 수 있을지 검색하다가 lazy loading이라는 방법을 확인했습니다. lazy loading은 사용자가 화면을 보기 직전 순간까지 이미지를 로드하지 않다가 필요할 때 로드하여, 초기 페이지 로드 시간을 줄이고 불필요한 데이터 전송량을 감소시켜 전체적인 웹사이트 성능을 개선하는 방법입니다. html 세팅은 다음과 같습니다. 태그에 attribute를 src 외에 data-src 하나 더 두는 것입니다. data-src는 src에 전달할 이미지 path를 잠시 담아두려는 목적을 갖고 있기 때문에 이름을 변경하셔도 괜찮습니다. 이렇게 html를 준비했다면, 사용자가 웹 페이.. 2024. 2. 20.
반응형