본문 바로가기

Javascript

(50)

JavaScript 자바스크립트 String.fromCodePoint() 사용법 예제 String.fromCharCode 차이 JavaScript String.fromCodePoint() String.fromCodePoint() - Code points의 순서에 따라 해당 번호의 문자를 반환 기본 구문 String.fromCodePoint(num1, num2, ,,,) 매개 변수 - 반환 값 code points에 해당하는 문자 반환 String.fromCodepoint() vs String.fromCharCode() (예제2 참고) String.fromCodePoint(), on the other hand, can return 4-byte supplementary characters, as well as the more common 2-byte BMP characters, by specifying their code point..

JavaScript 자바스크립트 .reduce() 사용법, 연습 예제 JavaScript Array.prototype.reduce() .reduce() - 배열의 각 요소에 대해 주어진 reducer 함수를 실행, 하나의 결과값을 반환 - 콜백 최초의 호출 때 acc, curr 의 값 ↓↓ * initialValue 없을 경우 acc = 배열의 첫 번째 값 = array[0] curr = 배열의 두 번째 값 = array[1] * initialValue 있는 경우 acc = initialValue 값 curr = 배열의 첫 번째 값 = array[0] - initialValue를 제공하지 않으면 reduce()는 index 1부터 시작해 callback 함수를 실행하고 첫 번째 index는 건너 뛴다. initialValue를 제공하면 index 0에서 시작 초기값(ini..

JavaScript 자바스크립트 .concat() 사용법, 연습 예제 JavaScript Array.prototype.concat() .concat() - 인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새 배열을 반환 - 기존 배열을 변경하지 않음. - 추가된 새로운 배열을 반환 - 호출한 배열 뒤에 각 인수를 순서대로 붙여 새로운 배열을 만든다. 인수가 배열인 경우 구성요소가 순서대로 붙고, 배열이 아니면 인수 자체가 붙는다. 중첩 배열 내부로 재귀하지 않는다. - concat은 this나 인수로 넘겨진 배열의 내용을 바꾸지 않고 주어진 배열을 합쳐 얕은 사본을 반환한다. - 원본 배열에 영향을 미치지 않음 (조작해도 변하지 않음) 기본 구문 array.concat([value1[,value2[, valueN]]]) 매개 변수 1. 배열 또는 값 만약 value1~ ..

JavaScript 자바스크립트 재귀함수 JavaScript 재귀함수 Recursive function * recursive 미국[rɪ│kɜːrsɪv]발음듣기 영국식[rɪ│kɜːsɪv]발음듣기 형용사 반복[되풀이]되는 * cursive 미국[│kɜːrsɪv]발음듣기 영국식[│kɜːsɪv]발음듣기 형용사 필기체인 JavaScript 재귀함수란? 함수가 자신을 다시 호출하는 구조로 만들어진 함수 재귀함수의 특징 : 1. 종료 조건이 있어야 하며 종료조건을 설정하지 않으면 무한 반복이 된다. 2. 재귀함수로 작성되는 코드는 반복문으로도 가능하다. 예제 1. 1부터 100까지의 총합 구하기 - 재귀함수가 아닌 반복문 let sum = 0; for(let i=1; i500){ return -1 }else if(num==1){ return answer; ..

JavaScript 자바스크립트 String 함수 .repeat() 사용하기 JavaScript String.prototype.repeat() .repeat() - 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환 한다. - 반복횟수는 양의 정수여야 함. - 반복횟수는 무한대보다 작아야 한다. 기본 구문 str.repeat(count) 매개 변수 1. count 문자열을 반복할 횟수 0과 양의 무한대 사이의 정수 (0 ~∞). 반환 값 현재 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열 예제1 let a = 'abc'; a.repeat(3); console.log(a) 위 코드를 보면 a.repeat()은 a 원래의 형태에 영향을 주지 않는다. 예제2 let a = 'abc'; console.log(a.repeat(0)); // console.log(a.repeat..

JavaScript 자바스크립트 배열 Array .filter() 란? 사용법 JavaScript Array.prototype.filter() .filter() - 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환 한다. - .filter()는 호출되는 배열을 변화(mutate)시키지 않는다. - 배열 내 각 요소에 대해 한 번 제공된 callback 함수를 호출해 callback이 true로 강제하는 값을 반환하는 모든 값이 있는 새로운 배열을 생성 - callback 은 할당된 값이 있는 배열의 인덱스에 대해서만 호출된다. - 삭제되었거나 값이 할당된 적 없는 인덱스에 대해서는 호출하지 않는다. - callback 테스트를 통과하지 못한 배열 요소는 그냥 건너뛰며 새로운 배열에 포함하지 않는다. - filter()호출 시작 이후 배열에 추가된 요소는 call..

javaScript 자바스크립트 .charCodeAt() 유니코드를 나타내는 값 반환 JavaScript String.protptype.charCodeAt() .charCodeAt() - 주어진 인덱스에 대한 UTF-16 코드를 나타내는 0 부터 65535 사이의 정수를 반환 * UTF-16(16-bit Unicode Transformation Format) https://upload.wikimedia.org/wikipedia/commons/0/01/Unifont_Full_Map.png 기본 구문 str.charCodeAt(index) char = '' String = "" - 지금까지 두개가 동일한 줄 알았다.... 매개 변수 1. index - 0 이상이고 문자열의 길이보다 작은 정수 - 숫자가 아니라면 0을 기본값을 사용함 ( charAt과 동일) 반환 값 주어진 인덱스의 문자에 대..

JavaScript 자바스크립트 .charAt() JavaScript String.prototype.charAt() .charAt() - 문자열에서 특정 인덱스에 위치하는 유니코드 단일문자를 반환 - 기본값은 stirng(0) 첫번째 문자 - str.length 초과 시 " " 빈 문자열 반환 기본 구문 str.charAt(index) 매개 변수 1. index 0과 str.length(-1) 값 사이 ( 0 ~ str의 길이 -1 ) 인자를 생략하면 기본값으로 0 으로 설정됨 -> 첫 문자 반환 반환 값 지정된 인덱스에 해당하는 유니코드 단일문자를 반환 만약 인덱스가 문자열의 길이보다 큰 경우 빈 문자열 " "을 반환한다. ( 아래 예시 有) 예제1 let a = 'a' let b = 'A' let c = 'aA' let d = 'Aa' console..

JavaScript 자바스크립트 .split() 사용법 알아보기 JavaScript String.prototype.split() .split() 란? - string 객체를 지정한 구분자를 이용하여 여러개의 문자열로 나누기 기본 구문 str.split([separator[,limit]]) separator 마다 끊기 매개 변수 separator (optional) limit (optional) 반환값 - 주어진 문자열을 separator 마다 끊은 부분 문자열을 담은 ARRAY - 배열로 ! 예제1 - separator only let a = 'aAaBdcDsCAaAAa'; let b = '1a2a3a4a5a6a' let c = 'a1a2a5a4a5a6' let d = '1a2a3a4a5a6' let e = '123a456a789' let f = 'a123a456a7..

JavaScript 자바스크립트 Math.abs() 절대값 만들기 JavaScript Math.abs() 함수는 주어진 숫자의 절대값을 반환한다. 기본틀 Math.abs(x) 매개변수 (1자리) - 숫자 반환값 - 해당 숫자의 절대값 예제1 function diff(a,b){ return Math.abs(a-b); } console.log(diff(100,200)); //100 let a = 100; let b = -100; console.log(a,b); // 100 -100 console.log(a, Math.abs(b)); // 100 100 예제2. console.log(Math.abs(1)); //1 console.log(Math.abs(-1)); //1 console.log(Math.abs(1000)); //1000 console.log(Math.abs(-1..

JavaScript 자바스크립트 Number.isInteger() 란? + 사용법 JavaScript Number.isInteger() 란 주어진 값이 정수인지 판별한다. 기본 구문 Number.isInteger(value) 매개변수 value - 1개 (정수인지 확인하려는 값) 반환값 -> Boolean (true or false) 예제 1 console.log(Number.isInteger(0)); //true console.log(Number.isInteger(1)); //true console.log(Number.isInteger(1000)); //true console.log(Number.isInteger(-0)); //true console.log(Number.isInteger(-100)); //true console.log(Number.isInteger(0.1)); //f..

JavaScript 자바스크립트 typeof() 란 ? 사용법 JavaScript typeof 란 피연산자의 평가 전 자료형을 나타내는 문자열을 반환 typeof 연산자는 피연산자 앞에 위치한다. 기본구문 typeof operand =피연산자 //괄호 없어도 가능 typeof (operand =피연산자) 매개변수 자료형을 가져올 객체 or 원시값을 나타내는 표현식 반환값 typeof 는 항상 string으로 반환한다. typeof가 반환하는 형식 (result) Type Result Undefined "undefined" Null "object: Boolean "boolean" Number "number" BigInt "bigint" String "string" Symbol "symbol" 호스트객체 (js 환경에서 제공) 구현체마다 다름 function 객체 "f..

JavaScript 자바스크립트 .toUpperCase() 란? 사용법 알아보기 JavaScript Stiring.prototype.toUpperCase() toUpperCase() 메서드는 문자열을 대문자로 변환하여 반환 한다. JavaScript의 문자열은 불변하므로 원본 문자에는 영향을 주지 않는다. 기본 구문 str.toUpperCase() 예외 function.prototype.call()등을 사용해 null이나 undefined에서 호출 시 예제1 let a = 'asdf' let b = 123 let c = '123' let d = 'abcDEF' console.log(a.toUpperCase()); // console.log(b.toUpperCase()); -> 오류 남 console.log(c.toUpperCase()); console.log(d.toUpperCase..

JavaScript 자바스크립트 .toLowerCase() 소문자로 변환하기 방법 JavaScript String.prototype.toLowerCase() .toLowerCase()는 문자열을 소문자로 변환해 반환 한다. 원래 문자열 string 에 영향을 주지 않는다. .toLowerCase() (소문자 반환) toUpperCase (대문자 반환) 기본 구문 str.toLowerCase() 반환값 - 문자열을 모두 소문자로 변환한 새로운 문자열 예제 1 let a = 'asdf' let b = 123 let c = '123' let d = 'abcDEF' console.log(a.toLowerCase()); // console.log(b.toLowerCase()); 오류 남 console.log(c.toLowerCase()); console.log(d.toLowerCase()); ..

JavaScript 자바스크립트 Math.PI란 ? 사용법 JavaScript Math.PI 란 ? = π 말그대로 PI 파이 원의 둘레와 지름의 비율 = 원주율 3.14159.... 의 값을 가짐 예제1 : 반지름을 인자값으로 받아서 원의 둘레 계산하기 function calculateCircumference(radius){ return Math.PI*radius*2; } console.log(calculateCircumference(1)); //

JavaScritp 자바스크립트 Math.max() 사용법 Math.max() 함수는 입력값으로 받은 0 개 이상의 숫자 중 가장 큰 숫자를 반환한다. 아무 요소도 주어지지 않았다면 -Infinity 반환 인수 중 하나라도 숫자로 변환하지 못하면 NaN로 반환 기본틀 Math.max([값1[, 값2[, ...]]]) 예제1 let x = 10 , y = -20 console.log(Math.max()); // 인수가 주어지지않은 경우 -Infinity console.log(Math.max(x,'안녕')); // 인수 중 하나가 String => NaN console.log(Math.max(x,y)); // 큰 수 10 반환 예제2 let a = [1,2,3,4,5,6,7,8,9,10]; let b = [10,9,8,7,6,5,4,3,2,1]; console.lo..

JavaScript, 자바스크립트 Math.min() 사용법 Math.min() 함수는 주어진 숫자 중 가장 작은 값을 반환한다. 주어진 인자값이 없는 경우 Infinity 반환 1개의 인자값이라도 숫자형으로 변환 불가능한 경우 NaN 반환 기본틀 Math.min([value1[, value2[, ...]]]) 예제1 let a = 10 , y = -20 console.log(Math.min(x,y)); 예제2 let a = [1,2,3,4,5,6,7,8,9,10]; let b = [10,9,8,7,6,5,4,3,2,1]; console.log(Math.min(...a)); console.log(Math.min(...b)); console.log(a.indexOf(Math.min(...a))); console.log(b.indexOf(Math.min(...b)));

JavaScript, 자바스크립트 Array.prototype.map() Method map 메서드란? map() Method - 배열 내의 모든 요소에 각각 대하여 주어진 함수를 호출한 결과를 새로운 배열에 담아 반환 각 요소에 대해 한번씩 순서대로 불러 그 함수의 반환값으로 새로운 배열을 만든다. undefined도 포함해서 처리하기 때문에 호출한 중간이 비어있는 경우, 동일한 인덱스를 빈 값으로 유지한다. 기본 구문 arr.map(callback(currentValue[, index[, array]])[, thisArg]) Parameters, 매개변수 casllback - 새로운 배열 요소를 생성하는 함수 (세 가지 인수를 가짐) currentValue - 처리할 현재 요소 index (Optional) - 처리할 현재 요소의 인덱스 arry (Optional) - map()을 호출한 배열 this..

enctype란? enctype의 속성 / nunjucks post로 서버에 이미지 보내기 <form method="post" enctype="multipart/form-data"> enctype = encoding type 말 그대로 인코딩의 형태를 지정해주는 것 태그와 함께 쓰이며 form 안의 data 가 server로 제출될 때 해당 데이터를 어떻게 인코딩할지 인코딩되는 방법을 명시 한다. ** method가 post일 경우에만 사용 가능 기본 frame enctype="____" 안에 들어갈 속성값 3가지 속성값 설명 application/x-www-form-urlencoded 기본값, 모든 문자들을 서버로 보내기 전 인코딩됨을 명시 multipart/form-data 모든 문자를 인코딩하지 않음을 명시 보통 form 요소가 파일, 이미지를 서버로 전송 시 주로 사용 text/plain 공백 문자 (space)는 "+" 기호로 변환, 그 외의 나머지 문자는 모두 인코딩되지 ..

[35일차 복습 및 정리] JavaScript async, await 사용법 async, await 공부 전 알아야할 Promise 객체 ↓↓↓ blckchainetc.tistory.com/83 [35일차 복습 및 정리] JavaScript Promise 란? 사용법 / Promise.all / .then .catch .finally 정리 이전 글 : callback 함수 / Callback hell, 콜백함수의 지옥 포스팅 ↓↓ Promise 그 유명한.... Callback Hell 콜백함수의 지옥 현상을 극복했다는 평을 받는 promise, 반드시 알아두어야 하는 객체! /* Pr.. blckchainetc.tistory.com ----------------------------------------------------------------------------------..

Callback 함수, 콜백 함수란 ? 사용 이유 특징 : non-block , 비동기 (asynchronous) 방식이다. -> 어떤 일을 다른 객체에게 시키고 그 일이 끝나기를 기다리지 않고 그 객체가 다시 나를 부를 때까지 내 할일을 하고 있을 수 있음. 콜백 함수를 써야하는 경우에 콜백함수를 쓰지 않는다면 콜백함수 과정이 끝나기 전에 다른 프로세스를 진행하게 되는 경우가 있다. 값을 읽기 전에 출력을 해버려서 undefined가 뜬다. 내용이 복잡할 수록 callback이 많아지므로 구조를 잘 짜서 함수를 쓰는게 좋다. 참고사이트 dalkomit.tistory.com/65 [Node.js 강좌] 10. Callback 함수란 무엇인가 ? Callback 함수 흔히 Node.js 에 대한 정보들을 검색하다 보면, Callback 지옥에 빠진다 ! ..

input type checkbox 전체 선택 / 해제 JavaScript 로 만들기 getElementsByName 사용 게시판 All 번호 제목 작성자 수정 날짜 작성 날짜 조회수 {% for item in board_db %} {{item.idx2}} {{item.subject}} {{item.writer}} {{item.motoday}} {{item.today}} {{item.hit}} {% endfor %} 돌아가기 글쓰기 게시판을 만들다가 checkbox 를 쭈르룩 만들고 전체 선택 / 해제를 하기위한 JavaScript 는 위와 같다. 기본 참고한 예제는 ↓↓↓↓ select all 개 고양이 getElementsByName 으로 name="animal"인 elements의 NodeList를 만들고 forEach구문을 사용해서 각각의 요소 (checkbox)에 적용 참고글 hianna.tistory.com/432..

[JavaScript] input type="text" 글 쓰지 못하게 막기 readonly disabled 차이 node.js 게시판 만들기 서버에 보내줄 modify.html readonly 여기서 넣은 요걸 수정하지 못하게 막는 방법 readonly 만 넣어주면 된다 그럼 다른건 수정이 되지만 "글 번호" text 부분은 text background 등이 다른 text 들과 같지만 클릭해서 수정이 안된다. disabled disabled 경우 아예 클릭도 안되고 회색으로 막혀 있음. * 주의사항 form 안에 disabled 해버리면 아예 disabled 시킨거라 form전송 값으로 전달이 되지 않는다. -> sumbit 했을 때 subject, writer, content 값만 전송이 /modifydone (action) 일로 됨. 그래서 나는 readonly를 써야겟다.

[Do it! 자바스크립트 입문책 독학 1편] JavsScript Method 메서드 / 기초 연산 문법 / 조건문, if, else, else if, 선택문 switch, 반복문, while, do while, for, break, continue, 중첩for문 Java Script 자바스크립트 기초문법 (연산자, 산술, 대입, 증감, 비교, 논리, 연산자 우선순위, 삼항 조건 연산자) 왜 boolean 안에 값이 없으면 false고 값이 있으면 True 일까? - > boolean은 () 안 "" 빈 문자, 숫자 0,null, undefined 등을 제외한 모든 데이터에 대해 True 를 반환. ex) Boolean(0) false var num1 = 10; var num2 = 3; num1 +=num2; document.write(num1); //13 num1 -=num2; document.write(num1); // 10 num1 *=num2; document.write(num1); // 30 num1 /=num2; document.write(num1); ..

이전 1 2 3 다음

티스토리툴바