본문 바로가기

개발공부일지/JavaScript25

JavaScript - Math 이해하기 안녕하세요. Hynn 입니다. 이번 포스팅에서는 다음 포스팅에서 재미난 형태로 작성하게 될 포스팅에 앞서, 개념을 정리하는 포스팅입니다. Math 함수는, 이전 포스팅에서 다루었던, JavaScript 에서 기본적으로 다루고 있는 Window 라는 객체 안에 내장되어 있는 Method입니다. 이 객체는 JavaScript 에서 수학적인 계산을 위해서 사용하기도 하고, 무작위숫자나, 소숫점 단위의 숫자를 출력하는 역활도 합니다. 여기서 우리가 자주 떠오르는 몇가지 항목들이 있을 것입니다. Math 에 대해서 배워보는 글을 작성해보겠습니다. ========== 1. Math 에 대해서 알아보기 2. Math 에서 사용되는 주요 Method 3. 실제 작성예시 ========== 1. Math에 대해서 알아보.. 2022. 11. 9.
JavaScript -선형 검색/완전 탐색(Linear Search) 안녕하세요. Hynn 입니다. 이번 포스팅에서는 이제 Array(배열)이 무작위로 나열되어 있을때, 이를 일일히 확인하지 않더라도, 특정 값(Value) 를 검색하는 기능을 구현하는 방법을 작성해보겠습니다. 이 검색의 명칭은 선형검색 혹은 완전 탐색이라고 하며, 정식 명칭은 Linear Search 입니다. ======== 1. Linear Search 2. 예제 작성하기 ======== 1. Linear Search Linear Search 는 선형 검색/완전 탐색이라고도 불리우는 알고리즘이라고도 합니다. 이 방식은 단방향 (JavaScript 에서는 왼쪽에서 오른쪽) 으로 탐색을 진행하여 원하는 데이터를 검색하는 방식으로 보자면 매우 단순한 방형태의 알고리즘입니다. 이는 구현에서의 편리성을 장점으로 .. 2022. 11. 9.
JavaScript - Array(배열) 객체 편집하기 안녕하세요. Hynn입니다. 이번 포스팅에서는 Array(배열) 로 이루어진 객체에서 이미 들어가 있는 데이터를 편집하거나, 그를 추가하는 방식에 대해서 몇가지 소개해드리고자 합니다. 기존에 생성자 함수도 사용했지만, 보다 간편하게 처리하는 방식을 학습해보고자 합니다. 시작해보겠습니다. ============ 1. 배열참조 2. .push, . pop 3. splice, slice ============ 1. 배열참조, 배열참조의 경우, 아래의 함수로 간략하게 표현할 수 있습니다. 배열참조 const aarr = newarr() const arr2 = [] 위의 형태를 이전 포스팅에서 생성자함수를 이용해서 틀을 만들고, 그틀에 요소를 추가하는 형태로 생성자함수라는 것을 언급한 바 있습니다 하지만 기존의 .. 2022. 11. 7.
JavaScript - DOM 기본 사용법 안녕하세요. Hynn 입니다. 이전 포스팅에서 설명드린 것 처럼 DOM 을 사용하기 위해 기본적으로 사용되는 몇가지를 가지고 설명하는 포스팅을 작성하고자 합니다. 이 기능을 통해, 작성하는 요령을 기초적으로 익히는 페이지가 되기를 바랍니다. ========== 1. DOM 사용을 위해 기본 준비과정 2. getElementByID 3. getElementByTagName 4. querySector/ querySectorALL 5. getElementByClassName ========== 1. DOM 사용을 위해 기본 준비과정 오랜만에[?] 문서를 연결하는 과정을 거쳐야 하다보니, 이러한 준비과정을 별도로 과정에 포함하게 되었습니다. 이전에 반복해서 했듯이, css 파일과 javascript 파일을 각각.. 2022. 11. 7.
JavaScript - Windows 객체 안녕하세요. Hynn 입니다. 이전 포스팅까지에서는, JavaScript 의 기본적 의의, 변수, 연산자, 함수 기본의 대한 포스팅 위주로 작성을 했습니다. 이제 JavaScript 라는 친구를 사용해서, HTML/CSS 에 같이 녹여내기 위해서는, DOM,BOM 이라는 개념을 학습해야 합니다. 하지만 이 DOM/BOM 이라는 개념을 알기 전, 반드시 알아야 할 개념의 대한 이해를 하고 난 뒤, 주제를 다루어볼까 합니다. 다소 지루한 내용이 될 수 있겠지만, 이 내용에 대해서는 개념을 이해하기 위해 반드시 필요한 주제라고 생각됩니다. 시작해보겠습니다. ============ 1. Window 란 무엇인가? 2. Window 객체를 활용하기 3. DOM/BOM 의 개념 ============ 1. Wind.. 2022. 11. 7.
JavaScript - 생성자함수, Spread Operator 안녕하세요. Hynn 입니다. 이번 포스팅에서는 , JavaScript 에서 생성자 함수를 사용하여, 객체 안에 여러 데이터를 부여하는 방법에 대해서 설명드리도록 하겠습니다. 이 생성자 함수를 이용하는 적합한 예시는 이렇습니다. 가령 예를 들어 A라는 학급에는 20명의 학생이 있습니다. 20 명의 학생의 각각의 대한 정보를 기록하기 위해서는, 20명의 개개인의 정보가 필요합니다. 이를 함수로 구현하는 방법을 생성자함수라고 칭하며, 이를 구성하는 방법을 같이 알아보도록 하겠습니다. =========== 1. 생성자 함수 2. 각각 데이터 입력방법 3. Spread Operator =========== 1. 생성자 함수 위에서 설명드린바와 같이, A 라는 학급에, 20명의 학생의 정보를 담기 위해서 생성자 .. 2022. 11. 6.