Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

JavaScript

  1. JavaScript Math.imul() 함수란? 용도와 사용 예제 총정리

    Math.imul() 함수란?JavaScript에는 여러 가지 곱셈 방법이 있지만, Math.imul() 함수는 일반적인 곱셈과 달리 두 매개변수에 대한 C 언어 방식(C-like)의 32비트 곱셈 결과를 반환합니다. 일반 곱셈 연산자(*)를 사용하면 큰 숫자를 다룰 때 64비트 부동소수점 방식으로 인해 예상과 다른 결과가 나올 수 있지만, Math.imul()은 32비트 정수 기준으로 정확한 결과를 보장합니다. 특히 C/C++ 코드를 JavaScript로 변환하는 Emscripten 같은 프로젝트에서 활용도가 매우 높습니다.문법v

  2. 자바스크립트 Math.asinh()와 Math.acosh() 함수의 용도와 사용법

    Math.asinh()와 Math.acosh() 함수는 각각 숫자의 쌍곡선 아크사인(hyperbolic arc-sine)과 쌍곡선 아크코사인(hyperbolic arc-cosine)을 구하는 데 사용됩니다.이 두 함수는 Math 객체의 정적 메서드(static method)이기 때문에, 별도로 생성한 수학 객체의 메서드로 호출할 수 없으며 항상 Math.asinh(), Math.acosh() 형태로 직접 호출해야 합니다. 두 함수 모두 ECMAScript 2015(ES6)에서 도입되었습니다.Math.asinh()이 메서드는 숫자의

  3. JavaScript에서 값을 숫자로 변환하는 방법 – Number() 메서드 완벽 정리

    JavaScript에서는 Number() 메서드를 사용하여 다양한 값을 숫자로 변환할 수 있습니다. 이 메서드는 숫자 형태의 문자열을 실제 숫자로 바꿔주고, 불리언(Boolean) 값은 true를 1로, false를 0으로 변환합니다. 또한 null이나 빈 문자열도 0으로 처리하며, 16진수나 지수 표기법으로 작성된 문자열까지 숫자로 변환할 수 있어 매우 유용합니다.문법(Syntax)Number() 메서드의 기본 사용법은 다음과 같습니다.var num = Number(value);괄호 안에 변환하고자 하는 값을 인수로 전달하면, 해

  4. JavaScript에서 JSON 문자열을 객체로 변환하는 방법 – JSON.parse() 완벽 가이드

    자바스크립트는 JSON.parse() 메서드를 제공하여 JSON 문자열을 객체(object)로 손쉽게 변환할 수 있습니다. JSON이 성공적으로 파싱되면, 그 안에 담긴 요소들에 자유롭게 접근하고 활용할 수 있습니다. 문법(Syntax) var obj = JSON.parse(JSON); JSON.parse()는 JSON 형식의 문자열을 인수로 받아 이를 자바스크립트 객체로 변환합니다. 변환된 객체를 통해 원본 JSON에 포함된 키(key)와 값(value)에 접근할 수 있습니다. 예제 1 다음 예제에서는 JSON 문자열을 변수에 할

  5. 자바스크립트 객체를 원시 데이터 타입으로 변환하는 방법

    원시 데이터 타입(Primitive data type)이란 문자열(string), 숫자(number), 불리언(boolean)처럼 더 이상 분해할 수 없는 기본적인 데이터 유형을 의미합니다. 자바스크립트에서 객체를 원시 데이터 타입으로 변환하려면 toString(), valueOf()와 같은 내장 메서드를 사용하면 됩니다. 이러한 메서드를 활용하면 복잡한 객체도 손쉽게 원시 값으로 바꿀 수 있습니다.주요 변환 메서드toString(): 객체를 문자열 형태의 원시 값으로 변환합니다.valueOf(): 객체가 나타내는 원시 값을 반환합

  6. 자바스크립트 화살표 함수에서 'this' 키워드는 어떻게 동작할까?

    화살표 함수에서의 this 키워드자바스크립트의 this 키워드는 자신이 속한 객체를 참조합니다. 일반 함수와 달리 화살표 함수는 자체적인 this를 갖지 않으며, 함수가 정의된 시점을 둘러싼 렉시컬 스코프(어휘적 범위)의 this 값을 그대로 상속받습니다.코드 최상위 레벨에서 정의된 화살표 함수의 this는 전역 객체(브라우저 환경에서는 window 객체)를 가리킵니다. 반면 일반 함수 내부에서는 호출 방식에 따라 this가 undefined가 되거나 예상과 다른 값으로 바뀔 위험이 있지만, 화살표 함수는 정의될 당시의 this를

  7. JavaScript로 폼(form)의 name과 target 속성 확인하는 방법

    HTML 폼(form)은 일반적으로 name(이름)과 target(대상)이라는 두 가지 중요한 속성을 가지고 있습니다. 특히 name 속성이 없으면 폼 데이터에 접근하거나 유효성 검사를 수행하기가 매우 어렵습니다. JavaScript에서는 폼 요소의 .name과 .target 속성을 통해 이 값들을 손쉽게 확인할 수 있습니다. 지금부터 각각의 방법을 하나씩 살펴보겠습니다. 폼의 Name(이름) 확인하기 다음 예제에서는 JavaScript의 .name 속성을 사용하여 폼의 이름을 가져와 화면에 출력합니다. 폼의 name 값은 주로

  8. JavaScript로 폼(form)의 accept-charset 및 enctype 속성 확인하는 방법

    JavaScript는 document.acceptCharset과 document.enctype이라는 DOM 속성을 제공합니다. 이를 활용하면 HTML 폼(form)의 accept-charset과 enctype 값을 아주 간단하게 조회할 수 있습니다. 지금부터 두 속성을 하나씩 자세히 살펴보겠습니다. Accept-Charset이란? accept-charset은 폼 데이터를 서버로 전송할 때 서버가 처리할 수 있는 문자 인코딩을 지정하는 속성입니다. 폼 요소에 설정된 이 값은 DOM 속성인 document.acceptCharset을 통

  9. JavaScript로 문서의 마지막 수정 날짜와 시간 표시하는 방법

    웹 문서는 생성된 이후 지속적으로 변경되며 그 생애 주기 동안 수많은 수정 과정을 거치게 됩니다. JavaScript는 문서가 마지막으로 수정된 시점을 확인할 수 있도록 document.lastModified라는 속성을 기본적으로 제공합니다. 이 속성을 사용하면 별도의 서버 설정 없이도 문서가 마지막으로 변경된 정확한 날짜와 시간을 손쉽게 가져올 수 있습니다. 기본 문법 Time = document.lastModified; document.lastModified는 문자열 형태로 값을 반환하며, 일반적으로 MM/DD/YYYY HH:M

  10. JavaScript로 폼(form)의 action 속성과 method 값 확인하는 방법

    개요HTML 폼(form)의 action 속성과 method는 폼에 기본적으로 내장되어 있는 값이 아니라, 개발자가 직접 지정해야 하는 항목입니다. 자바스크립트에서는 폼 요소가 제공하는 action 속성과 method 속성을 사용하면 이 두 가지 값을 매우 간단하게 읽어올 수 있습니다. 이번 글에서는 각각의 사용 방법을 예제와 함께 살펴보겠습니다.1. action 속성 확인하기action 속성은 폼 데이터가 전송될 목적지 URL을 나타냅니다. 다음 예제에서는 document.getElementById()로 폼 요소를 가져온 뒤, a

  11. JavaScript에서 함수 호출 시 괄호 ()를 사용해야 하는 이유

    JavaScript에서 함수를 다룰 때 괄호 ()는 매우 중요한 역할을 합니다. 함수 이름만으로 접근하면 함수의 정의(코드 자체)가 반환되고, 실제 실행 결과는 얻을 수 없습니다. 반면 괄호 ()를 붙여 호출하면 함수가 실행되어 그 결괏값을 받을 수 있습니다. 괄호 없이 함수에 접근하는 경우 예제 아래 예제에서는 함수를 괄호 없이 접근했습니다. 따라서 출력 결과에서 볼 수 있듯이 결과값이 아닌 함수 정의 전체가 그대로 반환됩니다. <html> <body> <script> function toCe

  12. JavaScript에서 값을 불리언(Boolean)으로 변환하는 3가지 방법

    값을 불리언(boolean)으로 변환하는 작업은 조건문을 처리할 때 매우 유용하게 활용됩니다. JavaScript에서는 값을 boolean으로 변환하는 세 가지 방법이 있으며, 그중 두 가지는 Boolean 키워드를 사용하고, 나머지 한 가지는 !! 연산자를 활용하는 방식입니다. 지금부터 각각의 방법을 자세히 살펴보겠습니다.1. Boolean 키워드 사용하기예제다음 예제에서는 Boolean 키워드를 활용한 두 가지 변환 방법, 즉 new Boolean() 생성자와 Boolean() 함수를 구현하고 그 결과를 화면에 출력합니다.<

  13. JavaScript에서 변수 키를 사용해 객체 값에 접근하는 방법

    자바스크립트에서 객체 값에 접근하는 방법으로는 일반적으로 점 표기법(Dot Notation)과 대괄호 표기법(Bracket Notation)이 널리 알려져 있습니다. 하지만 이 두 가지 방법 외에도 변수 키(variable key)를 활용하면 더욱 유연하게 객체 값에 접근할 수 있습니다. 이번 글에서는 각각의 방법을 간단히 살펴보겠습니다.점 표기법과 대괄호 표기법 사용하기예제다음 예제에서는 점 표기법과 대괄호 표기법을 사용하여 객체 값에 접근합니다. 여기서 대괄호 표기법이란 문자열 키(string key)를 이용해 값에 접근하는 방

  14. JavaScript에서 객체에 동적 속성 키를 설정하는 방법

    예전에는 객체에 속성을 생성하려면 두 단계의 과정이 필요했지만, ES6의 등장으로 이 작업이 매우 간단해졌습니다. 이제 한 단계만으로 속성을 동적으로 생성할 수 있습니다. 지금부터 자세히 살펴보겠습니다. 기존 방식(2단계 과정) 예제 다음 예제에서는 속성을 객체 내부에 직접 선언하지 않고 객체 외부에서 별도로 선언하기 때문에 두 단계의 과정이 됩니다. <html> <body> <script>     let person = name;    

  15. JavaScript ES6 템플릿 문자열(Template Strings)이 중요한 이유와 활용법

    ES6 템플릿 문자열(Template Strings)은 문자열을 조합하는 새로운 방식입니다. 기존에도 join(), concat() 같은 메서드로 문자열을 합칠 수 있었지만, 템플릿 문자열은 그 어느 방법보다 가독성이 뛰어나고 세련된 접근 방식입니다. 따옴표를 이스케이프하기 위한 백슬래시(\)가 필요 없고, 코드를 지저분하게 만들던 플러스(+) 연산자 반복도 더 이상 없습니다. concat()과 join()을 사용하는 기존 방식 예제 아래 예제에서는 join()과 concat() 메서드를 사용해 문자열을 조합합니다. 코드를 자세히

  16. JavaScript에서 문자열과 숫자를 연결 없이 더하는 방법 (+ 연산자와 parseInt 활용)

    JavaScript에서 문자열과 숫자를 + 연산자로 더하면 산술 덧셈이 아니라 문자열 연결(concatenation)이 일어납니다. 두 값이 단순히 이어 붙여지는 것이죠. 실제로 두 값을 더하고 싶다면 문자열을 먼저 숫자로 변환해야 하는데, 이때 단항 + 연산자가 유용하게 사용됩니다. 이 연산자는 문자열을 숫자로 변환해 주기 때문에 의도한 대로 정상적인 덧셈이 가능해집니다.예제 1: 변환 없이 더할 경우아래 예제에서는 문자열을 별도의 변환 과정 없이 숫자에 바로 더했습니다. 따라서 출력 결과에서 확인할 수 있듯이 덧셈이 아닌 연결이

  17. 자바스크립트 고차 함수란? filter() 활용 예제로 배우는 개념과 장점

    자바스크립트 고차 함수(Higher-Order Function)란?자바스크립트는 특정 작업을 손쉽게 처리할 수 있도록 다양한 내장 함수를 제공합니다. 하지만 이러한 내장 함수만으로 문제를 일반적인 방식으로 해결하면 코드가 길어지고 복잡해지기 쉽습니다. 이를 보완하기 위해 자바스크립트는 고차 함수(Higher-Order Function)라는 강력한 도구를 기본적으로 제공합니다.고차 함수는 다른 함수를 인수로 전달받거나 함수를 반환하는 함수를 의미합니다. 고차 함수를 활용하면 코드의 길이를 줄이고 가독성을 높일 수 있으며, 접근성과 유

  18. JavaScript로 브라우저 언어와 플랫폼 확인하는 방법

    JavaScript는 브라우저와 관련된 다양한 정보를 확인할 수 있도록 navigator 객체를 제공합니다. 이 객체의 navigator.platform 속성은 브라우저가 실행 중인 플랫폼 정보를, navigator.language 속성은 브라우저의 언어 설정 정보를 반환합니다. 아래에서 각각의 사용 방법을 자세히 살펴보겠습니다. 브라우저 플랫폼 확인하기 문법 platform = navigator.platform; 예제 브라우저가 동작 중인 플랫폼 정보를 얻으려면 navigator 객체가 제공하는 navigator.platform

  19. JavaScript에서 링크의 href와 target 속성을 가져오는 방법

    JavaScript에서는 링크를 나타내는 앵커(<a>) 요소의 href 속성과 target 속성에 쉽게 접근할 수 있습니다. 링크는 보통 <p> 태그 안에 배치되며, 그 내부의 앵커 태그가 실제 목적지 URL(href)과 문서가 열리는 위치(target) 정보를 담고 있습니다. 먼저 document.getElementById() 등으로 해당 요소를 선택한 뒤 각 속성을 읽어오면 되는데, 아래에서 하나씩 자세히 살펴보겠습니다.href 속성 찾기링크의 href 속성 값을 가져오려면 대상 <a> 요소를 선

  20. JavaScript에서 문서의 제목과 URL을 가져오는 방법 – document.title과 document.URL 완벽 가이드

    JavaScript HTML DOM은 HTML 데이터에 접근하고 조작할 수 있는 다양한 기본 메서드를 제공합니다. 그중에서도 현재 문서의 제목(title)과 URL 정보가 필요할 때는 각각 document.title과 document.URL 속성을 사용하면 됩니다. 이 두 속성은 별도의 매개변수나 복잡한 설정 없이 즉시 값을 반환하기 때문에, 디버깅이나 동적 UI 구성 시 매우 유용하게 활용됩니다. 아래에서 하나씩 자세히 살펴보겠습니다. 문서의 제목 가져오기 – document.title 현재 HTML 문서의 제목(<title

Total 5929 -컴퓨터  FirstPage PreviousPage NextPage LastPage CurrentPage:166/297  20-컴퓨터/Page Goto:1 160 161 162 163 164 165 166 167 168 169 170 171 172