일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 히든 스토리
- ESG
- 비메모리 자원
- 월칙
- try width resources
- 참조 계수
- try-with-resources
- apache kafka
- docker
- CSS
- 공헌감
- 아웃풋법칙
- colllection
- 부자의그릇
- 도파민형 인간
- 과제의 분리
- HTML
- 뉴 컨피던스
- Container
- 수부타이
- kubernetes
- 레퍼런스 복사
- Infresh
- 칭기즈칸의 위대한 장군 수부타이
- 이펙티브 자바
- 모두가 기다리는 사람
- sentry
- java
- node
- 쿠버네티스
- Today
- Total
목록WEB(웹) (213)
Hi
https://www.cmsfactory.net/node/10914
http://bamtol.net/v5/bbs/board.php?bo_table=pp_js&wr_id=36
Date 객체 Date 객체 날짜와 시간을 표시하는 객체. // 변수를 선언합니다. var date = new Date(); // 출력합니다. alert(date); 매개 변수를 입력하지 않으면 현재 시각으로 초기화 // 문자열을 사용한 Date 객체 생성 var date = new Date('December 9, 1991'); var date = new Date('December 9, 1991 02:24:23'); // 숫자를 사용한 Date 객체 생성 var date = new Date(1991, 11, 9); var date = new Date(1991, 11, 9, 2, 24, 23); var date = new Date(1991, 11, 9, 2, 24, 23, 1); // Unix time을 ..
http://unikys.tistory.com/285
display: flex 안에 display: flex를 하게되면 min-height:를 지정해줘야 높이가 무시되지 않는다.
기본 선택자 기본 선택자 $('h1').css('color', 'red'); // $ 선택자 메서드 전체 선택자 $('*').css('color', 'red'); * : 전체선택자 css() : 첫번째 매개변수 - 바꾸고자 하는 스타일 속성 이름. 두번째 매개변수 - 스타일 속성 값 태그 선택자 $(document).ready(function() { $('h1').css('color', 'orange'); }); 아이디 선택자 $('#target').css('color', 'orange'); 클래스 선택자 $('.item.select').css('color', 'orange'); 자손 선택자와 후손 선택자 자손 선택자 ‘요소A > 요소B’ 의 형태로 사용. body 태그의 자식으로 범위를 한정해 전체가 ..
문서 객체 모델 문서 객체 모델 DOM, Document Object Model 넓은 의미 : 웹 브라우저가 HTML 페이지를 인식하는 방식 좁은 의미 : document 객체와 관련된 객체의 집합 index
함수 호출과 this함수 호출 또한 다른 언어와는 달리 자유롭다.arguments 객체함수를 호추할 때 인수들과 함께 암묵적으로 arguments 객체가 함수 내부로 전달 되기 때문에, 인자를 아무렇게나 넣어도 작동 되고 있다. arguments 객체를 다를 줄 알아야 한다. arguments 객체 : 함수를 호출할 때 넘긴 인자들이 배열 형태로 저장된 객체 실제 배열이 아닌 유사 배열 객체// add() 함수 function add(a, b) { // arguments 객체 출력 console.dir(arguments); return a + b; } console.log(add(1)); // (출력값) NaN console.log(add(1, 2)); // (출력값) 3 console.log(add(1..
캡슐화 캡슐화 관련된 여러가지 정보를 하나의 틀 안에 담는 것. 멤버 변수와 메서드 -> 관련된 정보가 되고 클래스가 관련된 정보들을 담는 하나의 큰 틀. 정보은닉 -> 정보의 공개 여부를 결정 var Person = function(arg) { var name = arg ? arg : "zzoon" ; this.getName = function() { return name; }; this.setName = function(arg) { name = arg; }; }; var me = new Person(); console.log(me.getName()); // zzoon me.setName("iamhjoo"); console.log(me.getName()); // iamhjoo console.log(me..
함수의 다양한 형태 함수의 다양한 형태 콜백 함수 코드를 통해 명시적으로 호출하는 함수가 아니라, 개발자는 단지 함수를 등록하기만 하고, 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출되는 함수. (익명함수의 대표적인 예) 특정 함수의 인자로 넘겨져, 코드 내부에서 호출되는 함수 또한 콜백 함수가 될 수 있다.ex) 이벤트 핸들러 처리 이벤트 핸들러에 콜백 함수가 등록됐다면, 콜백 함수는 이벤트가 발생할 때마다 브라우저에 의해 실행된다. window.onload : 이벤트 핸들러. 웹 페이지의 로딩이 끝나는 시점에 load 이벤트가 발생하면 실행된다. window.onload 이벤트 핸들러를 익명 함수로 연결 // 페이지 로드 시 호출될 콜백 함수 window.onload = funct..
함수 객체 함수 객체 : 함수도 객체다 자바스크립트에서는 함수도 객체다 // 함수 선언 방식으로 add()함수 정의 function add(x, y) { return x + y; } // add() 함수 객체에 result, status 프로퍼티 추가 add.result = add(3, 2); add.status = 'OK'; console.log(add.result); // 5 console.log(add.sattus); // 'OK' add()함수 객체는 [[Code]] 프로퍼티, result와 status 프로퍼티를 가진다. 자바스크립트에서 함수는 값으로 취급된다 자바스크립트에서 함수는 객체다. 함수도 일반 객체처럼 취급 될수 있다. 리터럴에 의해 생성 변수나 배열의 요소, 객체의 프로퍼티 등에 할..
(javascript) isNaN() isNaN() is Not a Number ? // 마지막 캐릭터가 숫자일 때 if (!isNaN(expression[expression.length - 1])) // 연산자를 추가시킨다 $value.text(expression + $(this).attr('operator'));
window 객체 window 객체 자바 스크립트의 브라우저 기반 최상위 객체 alert(), prompt() 함수 모두 window 객체의 메서드 입니다. window.alert(); 기본 변수와 window 객체 var 키워드로 선언한 일반 변수도 모두 window 객체의 속성이 된다. 새로운 window 객체 생성 window.open(URL, name, features, replace); window.open(); // 새로운 웹브라우저 윈도우가 만들어집니다. window.open('http://hanbit.co.kr', 'child', 'width=600, height: 300', true); open() 메서드 : 새로운 window 객체를 생성하는 메소드 이면서, 윈도우 객체를 리턴한다. /..
브라우저 객체 모델 브라우저 객체 모델 Brower Object Model : 웹 브라우저와 관련된 객체의 집합 대표적 브라우저 객체 모델) window, location, navigator, history, screen, documnet 객체 간단하게 문서 객체 모델 (DOM)이라 통합해서 부르기도 하지만,, document 객체와 관련된 객체의 집합이 또 있음.
jquery와 $ jQuery 와 $ 자바스크립트에서 식별자로 사용할 수 있는 특수 기호는 $ 와 _ 여기서 $를 식별자로 사용했을 뿐 window.jQuery = window.$ = jQuery; jQuery 식별자를 $로 대체했을 뿐. 따라서 $ 식별자가 아니라 jQuery 식별자를 사용해도 되지만, 쉽게 $쓴다.
$(documnet).ready() $(documnet).ready() 문서가 준비되면 매개변수로 넣은 콜백함수를 실행하라는 의미. 한 이벤트로 여러 개의 함수를 연결할 수 있습니다. $(document).ready(function() { alert('First READY'); }) $(document).ready(function() { alert('Second READY'); }) $(document).ready(function() { alert('Third READY'); }) 간단한 형태 $(function() { });
소스 코드가 모두 붙어 클라이언트에게 제공할 웹 페이지 용량을 줄이는 것
Subresource Integrity Hash : 스크립트를 사용한 공격(해킹 등)을 막기 위한 용도로 사용.
JSON.stringify 는 자바 스크립트 객체를 JSON 텍스트로 바꾸고 JSON 텍스트를 문자열에 저장합니다.JSON.parse 는 JSON 텍스트 문자열을 Javascript 객체로 변환합니다. 출처(참조) : https://code.i-harness.com/ko/q/10f62f8
cmd + shift + r : 원하는 글자를 전체 다 바꾸기
key들을 가지고 온다. Object.keys(arr).length
함수 정의 함수 정의 함수를 생성하는 방법 3가지 함수 선언문 함수 표현식 Function() 생성자 함수 함수 리터럴 함수도 일반 객체처럼 값으로 취급된다. 함수 리터럴을 이용해 함수를 생성할 수 있다. function add(x, y) { return x + y; } 함수 리터럴은 네 부분으로 구성 function 키워드 함수명(선택사항) 매개변수 리스트 : 매겨변수 타입을 기술하지 않음 함수 몸체 함수 선언문 방식으로 함수 생성하기 함수 리터럴 형태. 반드시 함수명이 정의되어 있어야 한다. C에서 사용하는 함수 정의 방법과 유사. 차이점 - function이라는 키워드를 명시적으로 사용, 변수 타입(int, char등) 을 기술 하지 않는다. // add() 함수 선언문 function add(x,..
연산자 연산자 +연산자 더하기 연산과 문자열 연결 연산. 두 연산자가 모두 숫자일 경우에만 더하기 연산이 수행 나머지는 문자열 연결 연산이 이뤄진다. var add1 = 1 + 2; var add2 = 'my ' + 'string'; var add3 = 1 + 'string'; var add4 = 'string' + 2; console.log(add1); // 3 console.log(add2); // my string console.log(add3); // 1string console.log(add4); // string2 typeof 연산자 피연산자의 타입을 문자열 형태로 리턴한다. 타입 세부타입 결과 기본타입 숫자 ‘number’ 기본타입 문자열 ‘string’ 기본타입 불린값 ‘boolean’ 기..
기본 타입과 표준 메서드 기본 타입과 표준 메서드 기본 타입의 경우는 객체가 아닌데 어떻게 메서드를 호출할 수 있을까? 기본 타입의 값들에 대해서 객체 형태로 메서드를 호출 -> 메서드 처리 순간에 객체로 변환. 그리고 메서드 호출이 끝나면 다시 기본값으로 복귀. // 숫자 메서드 호출 var num = 0.5; console.log(num.toExponential(1)); // 5.0e-1 // 문자열 메서드 호출 console.log("test".charAt(2)); // 's' toExponential() : 표준 숫자형 메서드. 숫자를 지수 형태의 문자열로 변환한다. charAt() : 문자열에서 인자로 받은 위치에 있는 문자를 반환한다. 숫자와 문자열 등은 기본 타입이지만, 이들을 위해 정의된 ..
배열 배열 굳이 크기를 지정하지 않아도 되며, 어떤 위치에 어느 타입의 데이터를 저장하더라도 에러가 발생하지 않는다. 배열 리터럴 새로운 배열을 만드는 데 사용하는 표기법. 대괄호 []를 사용 //배열 리터럴을 통한 5개 원소를 가진 배열 생성 var colorArr = ['orange', 'yello', 'blue', 'green', 'red]; console.log(colorArr[0]); // orange console.log(colorArr[1]); // yellow console.log(colorArr[4]); // red 배열의 요소 생성 동적으로 배열 원소를 추가할 수 있음값을 순차적으로 넣을 필요 없이 아무 인덱스 위치에나 값을 동적으로 추가할 수 있음. // 빈 배열 var emptyAr..
var text = $(".test").html().split('
프로토타입자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. (객체 지향의 상속 개념과 같이 부모 객체의 프로퍼티를 마치 자신의 것처럼 쓸 수 있는 것 같은 특징) 부모 객체를 프로토타입 객체(짧게는 프로토타입) 라고 부른다.var foo = { name: 'foo', age: 30 }; console.log(foo.toString()); // foo의 프로토타입에서 toString() 메서드를 가지고 옴 console.dir(foo); 모든 객체는 자신의 프로토타입을 가리키는 [[Prototype]]라는 숨겨진 프로퍼티를 가진다.toString() valueOf() hasOwnProperty() ... Object.prototype 객체 ㅅ ㅣ ㅣ (상속)name: 'foo', ..
참조 타입의 특성객체는 자바스크립트에서 참조타입객체의 모든 연산이 실제 값이 아닌 참조값으로 처리.var objA = { val : 40 }; var objB = objA; console.log(objA.val); // 40 console.log(objB.val); // 40 objB.val = 50; console.log(objA.val); // 50 console.log(objB.val); // 50 객체 비교동등 연산자 (==)를 사용하여 두 객체를 비교할 때도 객체의 프로퍼티 값이 아닌 참조값을 비교한다.var a = 100; var b = 100; var objA = { value: 100 }; var objB = { value: 100 }; var objC = objB; console.log(..
자바스크립트 참조 타입(객체 타입)기본 타입을 제외한 모든 값은 객체다.배열, 함수, 정규표현식 모두 결국 자바스크립트 객체로 표현자바스크립트에서 객체는 단순히 '이름(key):값(value)' 형태의 프로퍼티들을 저장하는 컨테이너, 해시라는 자료구조와 상당히 유사.참조타입인 객체는 여러개의 프로퍼티드릉ㄹ 포함. 객체의 프로퍼티는 기본 타입의 값을 포함하거나, 다른 객체를 가리킬 수도 있다.프로퍼티를 메소드라 부른다.객체 생성 기존 객체지향 언어에서의 객체 개념과는 약간 다르다. 클래스라는 개념이 없고, 별도의 생성방식.Object() 생성자 함수 이용 내장 Object() 생성자 함수 // Object()를 이용해서 foo 빈 객체 생성 var foo = new Object(); // foo 객체 프로..
기본 타입숫자, 문자열, 불린값, null, undefined// 숫자 타입 var intNum = 10; var floatNum = 0.1; // 문자열 타입 var singleQuoteStr = 'single quote string'; var doubleQuoteStr = "double quote string"; var singleChar = 'a'; // 불린 타입 var boolVar = true; // undefined 타입 var emptyVar; // null 타입 var nullVar = null; console.log( typeof intNum, typeof floatNum, typeof singleQuoteStr, typeof doubleQuoteStr, typeof boolVar, t..