소개:
이 장에서는이 포인터, 범위 및 프로토 타입과 같은 JS의 일부 원리를 깊이 설명하지 않습니다. 여기에는 코드를 단순화하고 개발 중에 실행 효율성을 향상시키는 데 도움이되는 일부가 포함되거나 경험적 방법으로 사용될 수 있습니다. 길이는 길지 않으며 작은 단계를 통해 전체 기사를 읽고 프로그래밍의 기쁨을 경험할 수 있습니다.
두 간격 내에 임의 숫자를 얻습니다
코드 사본은 다음과 같습니다.
함수 getRandomnum (min, max) {// 두 간격 내에서 난수를 얻습니다.
// @s s는 첫 번째 매개 변수가 두 번째 매개 변수보다 크다는 것을 제안하므로 판단을 추가하는 것이 더 신뢰할 수 있습니다.
if (min> max)
max = [min, min = max] [0]; // 두 가지 변수 값을 빠르게 교환합니다
var 범위 = max -min + 1;
var rand = math.random ();
반환 min + math.floor (rand * range);
};
양수/네거티브 매개 변수를 무작위로 반환하십시오
코드 사본은 다음과 같습니다.
함수 getRandomxy (num) {// 랜덤 긍정적/음수 매개 변수를 반환합니다
num = 새 번호 (num);
if (math.random () <= 0.5)
num = -num;
Num 리턴;
}
setInterVal () 또는 settimeout () 타이머 함수 패스 매개 변수입니다
코드 사본은 다음과 같습니다.
var s = '나는 매개 변수이다';
함수 fn (args) {
Console.log (Args);
}
var a = setInterval (fn (s), 100); // xxxxx 오류 xxxxxx
var b = setInterval (function () {// 정확한, 익명 함수로 시간이 지정된 함수를 호출하십시오.
fn (들);
}, 100);
setInterVal () 또는 settimeout () 타이머는 재귀 적으로 호출됩니다
코드 사본은 다음과 같습니다.
var s = true;
함수 fn2 (a, b) {// 3 단계
if (s) {
ClearInterval (A);
ClearInterval (b);
}
};
함수 fn (a) {// 2 단계
var b = setInterval (function () {
fn2 (a, b) // 두 타이머로 전달됩니다
}, 200)
};
var a = setInterVal (function () {// 1 단계
fn (a); // b는 시트 매개 변수에서 전달할 수있는 타이머 자체를 나타냅니다.
}, 100);
문자열을 숫자로 변환하십시오
코드 사본은 다음과 같습니다.
// 새 번호 (문자열) 또는 번호 (문자열)가 필요하지 않음 문자열에서 0을 빼십시오.
var str = '100'; // str : 문자열
var num = str -0; // num : 숫자
널 가치 판단
코드 사본은 다음과 같습니다.
var s = ''; // 비어있는 문자열
if (! s) // 빈 문자열은 기본적으로 부울 거짓으로 변환되며 판단 진술서에 직접 쓸 수 있습니다.
if (s! = null) // 그러나 빈 문자열! = null
if (s! = undefined) // 빈 문자열도! = undefined입니다
즉, 브라우저 parseint () 메소드
코드 사본은 다음과 같습니다.
// 다음 변환은 IE에서 0이고 다른 브라우저는 1입니다. 이것은 IE 브라우저의 숫자 설명과 관련이 있습니다.
var inum = parseint (01);
// 호환되는 글은입니다
var num = parseint (새 번호 (01));
Firebug JS 코드를 편리하게 디버그합니다
코드 사본은 다음과 같습니다.
// FireBug에는 내장 콘솔 객체가있어 정보를 표시하는 내장 방법을 제공합니다.
/**
* 1 : alert () 또는 docum 예 : Console.log ( " %d 년 %d 달 %d day", 2011, 3, 26)
* 2 : 정보가 너무 많으면 그룹으로 표시 할 수 있습니다. 사용 된 메소드는 Console.group () 및 Console.groupend ()입니다.
* 3 : console.dir ()는 객체의 모든 속성과 메소드를 표시 할 수 있습니다.
* 4 : console.dirxml ()는 웹 페이지 노드에 포함 된 HTML/XML 코드를 표시하는 데 사용됩니다.
* 5 : Console.Assert () Assert, 표현식 또는 변수가 True인지 결정하는 데 사용됩니다.
* 6 : console.trace ()는 함수의 통화 트랙을 추적하는 데 사용됩니다.
* 7 : console.time () 및 console.timeend ()는 코드의 실행 시간을 표시하는 데 사용됩니다.
* 8 : 성능 분석 (Profiler)은 프로그램의 각 부분의 실행 시간을 분석하여 병목 현상을 찾는 것입니다. 사용 된 방법은 console.profile () .... fn .... console.profileend ()입니다.
*/
현재 밀리 초를 빠르게 가져 가십시오
코드 사본은 다음과 같습니다.
// t == 현재 시스템 밀리 초 값, 이유 : + 사인 연산자가 호출되고 () valueof () 메소드가 호출됩니다.
var t = +새 날짜 ();
소수 정수 비트를 빨리 가져 가십시오
코드 사본은 다음과 같습니다.
// x == 2, 다음 x 값은 2이고 음수도 변환 할 수 있습니다.
var x = 2.00023 | 0;
// x = '2.00023'| 0;
두 개의 변수 값 교환 (중간 양)
코드 사본은 다음과 같습니다.
var a = 1;
var b = 2;
a = [b, b = a] [0]
경고 (a+'_'+b) // 결과 2_1, a 및 b의 값이 바뀌 었습니다.
논리적 또는 '||' 연산자
코드 사본은 다음과 같습니다.
// b는 null이 아닙니다 : a = b, b는 null : a = 1입니다.
var a = b || 1;
// 가장 일반적인 사용법은 플러그인 메소드의 매개 변수를 전달하고 이벤트 대상 요소를 얻는 것입니다. 이벤트 = 이벤트 || Window.event
// IE에는 window.event 객체가 있지만 FF는 그렇지 않습니다.
메소드 객체 만 프로토 타입 속성이 있습니다
코드 사본은 다음과 같습니다.
//이 방법에는 객체 프로토 타입 프로토 타입 속성이 있지만 원래 데이터에는 var a = 1과 같은이 속성이 없지만 A는 프로토 타입 속성이 없습니다.
기능인 () {} // 인간 생성자
person.prototype.run = function () {alert ( 'run ...'); } // 프로토 타입 실행 방법
person.run (); // 오류
var p1 = 새로운 사람 (); // 프로토 타입 실행 방법은 새 연산자를 사용하는 경우에만 P1에 할당됩니다.
p1.run (); // 달리다...
요일을 빨리 얻으십시오
코드 사본은 다음과 같습니다.
// 계산 시스템의 현재 시간은 일주일입니다.
var Week = "Today Is : Week" + "Day One, 2, Three, 4, Five, Six".charat (new Date (). getDay ());
폐쇄 편향
코드 사본은 다음과 같습니다.
/**
* 클로저 : 모든 JS 메소드 본문을 폐쇄라고 할 수 있습니다. 인라인 함수가 외부 함수의 특정 매개 변수 또는 속성을 말하는 경우 발생할 수 있습니다.
* 여러 하위 스코프가 존재할 수있는 독립적 인 범위 (즉, 메소드 중첩 방법)가 있으며, 마지막으로 클로저 범위는 가장 바깥 쪽 방법의 범위입니다.
* 자체의 메소드 파라미터와 모든 임베디드 함수의 메소드 매개 변수가 포함되어 있습니다. 따라서, 임베디드 함수가 외부에 참조를 갖는 경우, 참조의 범위는 참조 함수가있는 (최상위) 메소드 범위입니다.
*/
함수 a (x) {
함수 b () {
경고 (x); // 외부 기능 매개 변수를 참조하십시오
}
반환 b;
}
var run = a ( 'run ...');
// 범위의 확장으로 인해 외부 기능 변수 A를 참조하고 표시 할 수 있습니다.
달리다(); // alert () : run ..
주소 매개 변수 문자열 및 타임 링크를 가져옵니다
코드 사본은 다음과 같습니다.
// 물음표를 받으시겠습니까? 다음 내용에는 물음표가 포함됩니다
var x = Window.location.search
// # 번호를 포함하여 알람 번호 # 뒤에 컨텐츠를 가져옵니다.
var y = window.location.hash
// 자동 웹 페이지 타이머로 새로 고침을 달성 할 수 있습니다.
Window.location.reload ();
널과 정의되지 않은
코드 사본은 다음과 같습니다.
/**
* 정의되지 않은 유형의 값은 하나뿐입니다. 즉, 정의되지 않았습니다. 선언 된 변수가 초기화되지 않은 경우 변수의 기본값이 정의되지 않았습니다.
* NULL 유형은 또한 하나의 값, 즉 NULL 만 있습니다. NULL은 아직 존재하지 않은 객체를 나타내는 데 사용되며 종종 존재하지 않는 객체를 반환하려는 함수를 나타내는 데 사용됩니다.
* ECMAScript는 정의되지 않은 것이 NULL에서 파생되었다고 생각하므로 동일하게 정의됩니다.
* 그러나 어떤 경우에는이 두 값을 구별 해야하는 경우 어떻게해야합니까? 다음 두 가지 방법을 사용할 수 있습니다
* 판단 할 때는 객체에 요구에 따라 값이 있는지 판단 할 때 '==='강력한 유형 판단을 사용하는 것이 가장 좋습니다.
*/
var a;
경고 (a === null); // a는 빈 개체가 아니기 때문에 false
경고 (a === 정의되지 않은); // true, a는 초기화되지 않기 때문에 값은 정의되지 않습니다.
// 소개하다
경고 (null == 정의되지 않은); // true, '=='연산자가 유형 변환을 수행하기 때문에
// 비슷하게
경고 (1 == '1'); // 진실
경고 (0 == 거짓); // true, false는 숫자 유형 0으로 변환됩니다
방법에 매개 변수를 동적으로 추가하십시오
코드 사본은 다음과 같습니다.
// 메소드 a에는 매개 변수 2가 하나 더 있습니다
함수 a (x) {
var arg = array.prototype.push.call (인수, 2);
경고 (인수 [0]+'__'+인수 [1]);
}
선택된 테두리 스타일을 사용자 정의합니다
코드 사본은 다음과 같습니다.
<!-페이지에 복사하여 효과를 시도하려면 스타일을 사용자 정의 할 수 있습니다.
<span style = "테두리 : 1px 솔리드 레드; 위치 : 절대; 오버플로 : 숨겨진;" >
<select style = "마진 : -2px;">
<옵션> 사용자 정의 선택 테두리 스타일 </옵션>
<옵션> 222 </옵션>
<옵션> 333 </옵션>
</선택>
</span>
가장 쉬운 색상 팔레트
코드 사본은 다음과 같습니다.
<!-js 값 값을 추출하고 모든 객체에 색상을 설정하려면->
<입력 유형 = 색상 />
함수, 객체는 배열입니까?
코드 사본은 다음과 같습니다.
var anobject = {}; // 객체
anobject.aproperty = "객체의 속성"; // 객체의 속성
anobject.amethod = function () {alert ( "객체의 메소드")}; // 객체의 메소드
// 다음에 중점을 둡니다.
경고 (anobject [ "aproperty"]); // 속성에 속성에 속성 이름이 첨자로 액세스 할 수 있습니다.
anobject [ "amethod"] (); // 메소드 이름을 첨자로 메소드 이름으로 메소드로 호출 할 수 있습니다.
for (anobject in anobject) // 반복 처리를 위해 객체의 모든 속성과 메소드를 전송합니다.
경고 (s +”는 a” + typeof (anobject [s]);
// 함수 유형의 객체와 동일합니다.
var afunction = function () {}; // 함수
afunction.aproperty = "함수 속성"; // 함수의 속성
afunction.amethod = function () {alert ( "function of function")}; // 기능의 방법
// 다음에 중점을 둡니다.
경고 (Afunction [ "Aproperty"]); // 속성 이름으로 속성에 속성에 액세스 할 수 있습니다.
Afunction [ "Amethod"] (); // 메소드 이름을 첨자로 사용하여 메소드를 호출 할 수 있습니다. 함수가 배열의 첨자로 사용될 때
for (afunction in afunction) // 반복 처리를위한 트래버스 함수의 모든 속성과 방법을 반복
경고 (s +”는 a” + typeof (afunction [s]);
코드 사본은 다음과 같습니다.
/**
* 예, 객체 및 함수는 속성 이름 또는 메소드 이름을 첨자로 사용하여 배열처럼 액세스하고 처리 할 수 있습니다.
* 그래서 배열이나 객체로 간주되어야합니까? 배열은 선형 데이터 구조로 간주되어야한다는 것을 알고 있습니다. 선형 데이터 구조에는 일반적으로 통합 배치 반복 작업 등에 적합한 특정 규칙이 있으며 이는 파도와 비슷합니다.
* 객체는 입자와 비슷한 흩어져 있고 개인화 된 물건을 설명하는 데 적합한 개별 데이터 구조입니다.
* 따라서 우리는 또한 다음과 같이 묻습니다. JavaScript 파 또는 입자의 물체입니까? 대상 양자 이론이 있다면 대답은 다음과 같아야합니다. 파동 입자 이중성!
* 따라서 JavaScript의 함수와 객체에는 객체와 배열의 특성이 모두 있습니다. 여기의 배열은 "사전"이라고 불리며, 임의로 스트레칭하고 응축 할 수있는 이름 값 쌍의 모음입니다. 실제로, 객체와 기능의 내부 구현은 사전 구조이지만,이 사전 구조는 엄격하고 절묘한 문법을 통해 풍부한 외관을 보여줍니다. 양자 역학이 입자를 사용하여 일부 장소의 문제를 설명하고 처리하는 한편, 파도는 다른 곳에서 문제를 설명하고 처리합니다. 또한 객체 나 배열을 사용하여 필요할 때 문제를 설명하고 처리하도록 자유롭게 선택할 수도 있습니다. JavaScript 의이 멋진 기능을 이해하는 데 능숙하다면, 간결하고 강력한 코드를 많이 쓸 수 있습니다.
*/
빈 영역을 클릭하면 요소가 닫히거나 숨길 수 있습니다.
코드 사본은 다음과 같습니다.
/**
* 때로는 페이지에 드롭 다운 메뉴가 있으므로 빈칸을 클릭하거나 다른 요소를 클릭 할 때 사용자가 숨겨야합니다.
* 글로벌 문서 클릭 이벤트를 트리거 할 수 있습니다
* @param {object} "대상 객체"
*/
$ (문서) .click (function (e) {
$ ( "대상 객체"). hide ();
});
/**
* 그러나 한 가지 단점은 요소를 클릭하여 표시하기를 원할 때입니다.
* 이벤트가 전 세계 문서 객체로 클릭하는 것을 방해하지 않으면 위의 방법이 실행됩니다.
*/
$ ( "대상 객체"). 클릭 (function (event) {
이벤트 = 이벤트 || Window.event;
event.stopPropagation (); // 대상 객체를 클릭 할 때 이벤트가 시간이 지남에 따라 버릴 수 없습니다.
$ ( "대상 객체"). 토글 ();
});
위의 내용은 일반적으로 사용되는 JavaScript 방법입니다. 나는 당신이 그것을 좋아하기를 바랍니다.