JavaScript 8

JSP에서 JavaScript 모듈 사용하기

📌 JSP에서 JavaScript 모듈 사용하기JSP에서 JavaScript 모듈을 사용하려면 몇 가지 주의해야 할 점이 있다. 특히, 를 사용하면 된다.common.js 파일이 로드되며, 전역 스코프에서 사용 가능. 하지만 ES6 모듈을 사용하면 이렇게 로드할 수 없다. 📌 2. ES6 모듈(export / import) 사용 방법ES6 모듈을 사용하려면 ✔️ 모듈을 사용하면 import 키워드를 통해 특정 함수만 가져올 수 있다. ❌ 이클립스에서는 ✔️ JSP에서 없이도 ES6 모듈처럼 활용할 수 있다. ✔️ 이클립스에서도 코드 색상이 정상적으로 표시됐다.

Frontend/javaScript 2025.04.06

JavaScript 코드 실행 순서 & 실행 타이밍 제어

📌 JavaScript 코드 실행 순서 & 실행 타이밍 제어 방법JavaScript는 브라우저에서 HTML을 해석하면서 실행된다! 그런데 코드의 실행 순서를 잘못 이해하면 예상과 다르게 동작하거나 오류가 발생할 수도 있다. 😵그래서 JavaScript의 실행 순서와 실행 타이밍을 제어하는 방법을 정리해보았다.✅ 1. JavaScript 코드 실행 순서JavaScript는 HTML을 위에서 아래로 해석하면서 실행된다.   🔹 기본적인 실행 흐름1️⃣ HTML(DOM) 위에서 아래로 해석2️⃣  🔹 실행 결과1️⃣ head 내부 스크립트 실행2️⃣ body 내부 script 실행3️⃣ document ready 실행 (DOM 완성 후)4️⃣ window.onload 실행 (이미지..

Frontend/javaScript 2025.04.06

[javaScript] 프로그래머스 - 게임 맵 최단거리

게임 맵 최단거리 https://school.programmers.co.kr/learn/courses/30/lessons/1844 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr - 문제 ROR 게임은 두 팀으로 나누어서 진행하며, 상대 팀 진영을 먼저 파괴하면 이기는 게임입니다. 따라서, 각 팀은 상대 팀 진영에 최대한 빨리 도착하는 것이 유리합니다. 지금부터 당신은 한 팀의 팀원이 되어 게임을 진행하려고 합니다. 다음은 5 x 5 크기의 맵에, 당신의 캐릭터가 (행: 1, 열: 1) 위치에 있고, 상대 팀 진영은 (행: 5, 열: 5) 위치에 있는 경우..

카테고리 없음 2023.09.21

[javaScript] 프로그래머스 - 네트워크

네트워크 https://school.programmers.co.kr/learn/courses/30/lessons/43162 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr - 문제 네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있을 때 컴퓨터 A와 컴퓨터 C도 간접적으로 연결되어 정보를 교환할 수 있습니다. 따라서 컴퓨터 A, B, C는 모두 같은 네트워크 상에 있다고 할 수 있습니다. 컴퓨터의 개수 n, 연결에 대한..

카테고리 없음 2023.09.21

[javaScript] 프로그래머스 - 타겟 넘버

타겟 넘버 https://school.programmers.co.kr/learn/courses/30/lessons/43165 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr - 문제 n개의 음이 아닌 정수들이 있습니다. 이 정수들을 순서를 바꾸지 않고 적절히 더하거나 빼서 타겟 넘버를 만들려고 합니다. 예를 들어 [1, 1, 1, 1, 1]로 숫자 3을 만들려면 다음 다섯 방법을 쓸 수 있습니다. -1+1+1+1+1 = 3 +1-1+1+1+1 = 3 +1+1-1+1+1 = 3 +1+1+1-1+1 = 3 +1+1+1+1-1 = 3 사용할 수 있는 숫자가 담긴..

[javaScript] 프로그래머스 - 여행경로

여행경로 https://school.programmers.co.kr/learn/courses/30/lessons/43164 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr - 문제 주어진 항공권을 모두 이용하여 여행경로를 짜려고 합니다. 항상 "ICN" 공항에서 출발합니다. 항공권 정보가 담긴 2차원 배열 tickets가 매개변수로 주어질 때, 방문하는 공항 경로를 배열에 담아 return 하도록 solution 함수를 작성해주세요. 제한사항 모든 공항은 알파벳 대문자 3글자로 이루어집니다. 주어진 공항 수는 3개 이상 10,000개 이하입니다. ticke..

[javaScript] 프로그래머스 - 단어 변환

단어 변환 https://school.programmers.co.kr/learn/courses/30/lessons/43163 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr - 문제 두 개의 단어 begin, target과 단어의 집합 words가 있습니다. 아래와 같은 규칙을 이용하여 begin에서 target으로 변환하는 가장 짧은 변환 과정을 찾으려고 합니다. 1. 한 번에 한 개의 알파벳만 바꿀 수 있습니다. 2. words에 있는 단어로만 변환할 수 있습니다. 예를 들어 begin이 "hit", target가 "cog", words가 ["hot",..

[javascript] sort() (정렬/객체배열정렬)

1. sort() arr.sort([compareFunction]) compare함수 파라미터 가 생력되면, 배열의 element들은 문자열로 취급되어, 유니코드 값 순서대로 정렬됨. 1. 오름차순 (숫자) 일반적인 문자열 배열은 arr.sort()하면 오름차순으로 정렬됨!But, 숫자일 경우 [10, 2, 1].sort()하면 [1, 10, 2]가 됨!!-> int로 parse하는 함수 작성 let brr = arr.sort(function(a, b) { return parseInt(a) - parseInt(b); }); 2. 내림차순 리턴이 b - a let brr = arr.sort(function(a, b) { return b - a; }); 3. 객체 배열 객체로 이루어진 배열일때는 객체의 ke..

Frontend/javaScript 2022.06.11