이 장에서는 이 포인터, 범위, 프로토타입과 같은 js의 일부 기본 원칙에 대해 심층적으로 설명하지 않습니다. 여기에는 일상적인 개발 중에 코드를 단순화하고 실행 효율성을 높이는 데 도움이 되는 몇 가지 사항이 포함되어 있습니다. 실증적인 방법으로 활용하면 길이도 길지 않고, 글 전체를 차근차근 읽어나가며 프로그래밍의 즐거움을 경험할 수 있습니다.
function getRandomNum(Min, Max){ // 두 간격 내에서 난수 가져오기
// @ Backfire Crazy는 첫 번째 매개변수가 두 번째 매개변수보다 클 가능성이 있으므로 판단을 조금 더 추가하는 것이 더 안정적이라고 제안했습니다
(최소 > 최대)
Max = [Min, Min = Max][0] // 두 변수 값을 빠르게 교환
var 범위 = 최대 - 최소 1;
var Rand = Math.random();
Min Math.floor(Rand * Range)를 반환합니다.
};
var s = '나는 매개변수입니다';
함수 fn(args) {
console.log(args);
}
var a = setInterval(fn(s),100); // xxxxxx 오류 xxxxx
var b = setInterval(function(){ // 정확합니다. 익명 함수를 사용하여 시간 제한 함수를 호출하세요
fn(들);
}, 100);
var s = true;
함수 fn2(a, b){ // 3단계
만약 (들) {
ClearInterval(a);
clearInterval(b);
}
};
function fn(a){ // 2단계
var b = setInterval(함수(){
fn2(a, b) // 타이머 2개 전달
}, 200)
};
var a = setInterval(function(){ // 1단계
fn(a); // b는 타이머 자체를 나타내며 좌석 매개변수로 전달될 수 있습니다
}, 100);
var s = ''; // 빈 문자열
if(!s) // 빈 문자열은 기본적으로 Boolean false로 변환되어 판단문에 직접 쓸 수 있습니다
if(s != null) // 그러나 빈 문자열 != null
if(s != 정의되지 않음) // 빈 문자열도 != 정의되지 않음
// 다음 변환은 IE에서는 0이고 다른 브라우저에서는 1입니다. 이는 IE 브라우저에서 숫자를 해석하는 데 사용하는 기본 시스템과 관련이 있습니다.
var iNum =parseInt(01);
// 따라서 호환되는 쓰기 방식은
var num = parsInt(new Number(01));
//Firebug에는 정보를 표시하는 내장 메소드를 제공하는 내장 콘솔 객체가 있습니다
/**
* 1: Alert() 또는 document.write()를 대체하는 데 사용할 수 있는 console.log()는 자리 표시자 출력, 문자(%s), 정수(%d 또는 %i), 부동 소수점 숫자(%f)를 지원합니다. ) 및 개체(%o). 예: console.log("%d년 %d월 %d일", 2011,3,26)
*2: 정보가 너무 많으면 그룹으로 표시될 수 있습니다. 사용되는 메소드는 console.group() 및 console.groupEnd()
*3: console.dir()은 객체의 모든 속성과 메서드를 표시할 수 있습니다
* 4: console.dirxml()은 웹 페이지의 노드에 포함된 html/xml 코드를 표시하는 데 사용됩니다.
* 5: 표현식이나 변수가 참인지 확인하는 데 사용되는 console.assert() 어설션
* 6: console.trace()는 함수 호출 추적을 추적하는 데 사용됩니다.
* 7: console.time() 및 console.timeEnd(), 코드의 실행 시간을 표시하는 데 사용
* 8: 성능 분석(Profiler)은 프로그램의 각 부분의 실행 시간을 분석하여 병목 현상이 발생한 위치를 찾는 것입니다. 사용되는 방법은 console.profile()....fn....console.profileEnd( )
*/
// b는 null이 아닙니다: a=b, b는 null입니다: a=1.
var a = b || 1;
// 더 일반적인 사용법은 매개변수를 플러그인 메소드에 전달하고 이벤트 대상 요소를 얻는 것입니다. event = event ||
// IE에는 window.event 개체가 있지만 FF에는 없습니다.
// 메소드에는 객체 프로토타입 프로토타입 속성이 있지만 원본 데이터에는 이 속성이 없습니다. 예를 들어 var a = 1, a에는 프로토타입 속성이 없습니다.
function Person() {} // 사람 생성자
Person.prototype.run = function() { Alert('run...') } // 프로토타입 실행 방법
Person.run(); // 오류
var p1 = new Person(); // new 연산자를 사용할 때만 프로토타입 실행 메소드가 p1에 할당됩니다
p1.run(); // 실행...
/**
* 클로저: 모든 js 메소드 본문을 클로저라고 부를 수 있습니다. 이는 인라인 함수가 외부 함수의 매개변수나 속성을 참조할 때만 발생하는 것이 아닙니다.
* 이 안에는 여러 하위 범위(즉, 메서드 중첩 메서드)가 있을 수 있는 독립적인 범위가 있습니다. 결국 클로저 범위는 가장 바깥쪽 메서드의 범위입니다.
* 자체 메소드 매개변수와 모든 내장 함수의 메소드 매개변수를 포함하므로 내장 함수에 외부 참조가 있는 경우 참조 범위는 참조 함수가 위치한 (최상위) 메소드 범위가 됩니다
*/
함수 a(x) {
함수 b(){
Alert(x); // 외부 함수 매개변수 참조
}
반품b;
}
var run = a('실행...')
// 범위 확장으로 인해 외부 함수 a의 변수를 참조하여 표시할 수 있게 되었습니다
실행(); // 경고(): 실행..
// 물음표를 얻으시겠습니까? 다음 내용에는 물음표가 포함되어 있습니다
var x = window.location.search
// #번호를 포함하여 경찰번호 #뒤의 내용을 가져옵니다
var y = window.location.hash
// 타이머를 사용하여 웹페이지를 자동으로 새로고침합니다
window.location.reload();
/**
* 정의되지 않은 유형에는 정의되지 않은 값이 하나만 있습니다. 선언된 변수가 초기화되지 않은 경우 변수의 기본값은 정의되지 않습니다.
* Null 유형에는 null 값이 하나만 있습니다. Null은 아직 존재하지 않는 개체를 나타내는 데 사용됩니다. 함수가 존재하지 않는 개체를 반환하려고 시도함을 나타내는 데 자주 사용됩니다.
* ECMAScript는 undefound가 null에서 파생된 것으로 간주하므로 동일하게 정의됩니다.
* 그런데 어떤 경우에는 이 두 가치를 구별해야 한다면 어떻게 해야 할까요? 다음 두 가지 방법을 사용할 수 있습니다
* 판단할 때, 객체에 값이 있는지 판단할 때는 '===' 강형 판단을 활용하는 것이 가장 좋습니다.
*/
var a;
Alert(a === null); // false, a는 빈 객체가 아니기 때문입니다
Alert(a === undefine); // true, a가 초기화되지 않았기 때문에 값이 정의되지 않았습니다
// 확장
Alert(null == undefine); // '==' 연산자가 유형 변환을 수행하므로 true입니다.
//마찬가지로
경보(1 == '1'); // 참
Alert(0 == false); // true, false는 숫자 유형 0으로 변환됩니다
/**
* 예, 객체와 함수는 속성 이름이나 메소드 이름을 첨자로 사용하여 배열처럼 액세스하고 처리할 수 있습니다.
* 그렇다면 배열로 봐야 할까요, 아니면 객체로 봐야 할까요? 우리는 배열이 선형 데이터 구조로 간주되어야 한다는 것을 알고 있습니다. 선형 데이터 구조는 일반적으로 특정 규칙을 가지며 통합 배치 반복 작업에 적합합니다.
* 객체는 개별 데이터 구조로, 입자와 같이 분산되고 개인화된 사물을 설명하는 데 적합합니다.
* 그러므로 우리는 다음과 같이 질문할 수도 있습니다. JavaScript의 객체는 파동인가 입자인가? 물체에 대한 양자 이론이 있다면 대답은 파동-입자 이중성이어야 합니다!
* 따라서 자바스크립트의 함수와 객체는 객체와 배열의 특성을 모두 가지고 있습니다. 여기서 배열은 임의로 확장할 수 있는 이름-값 쌍의 모음인 "사전"이라고 합니다. 실제로 객체와 함수의 내부 구현은 사전 구조인데, 이 사전 구조는 엄격하고 절묘한 구문을 통해 풍부한 모습을 보여줍니다. 양자 역학이 입자를 사용하여 어떤 곳에서는 문제를 설명하고 처리하고 다른 곳에서는 파동을 사용하는 것과 같습니다. 필요할 때 문제를 설명하고 처리하기 위해 객체나 배열을 자유롭게 선택할 수도 있습니다. JavaScript의 이러한 놀라운 기능을 잘 이해하는 한 간결하고 강력한 코드를 많이 작성할 수 있습니다.
*/
/**
* 때로는 페이지에 드롭다운 메뉴나 기타 효과가 있어서 사용자가 빈 공간을 클릭하거나 다른 요소를 클릭하여 숨겨야 하는 경우도 있습니다.
* 전역 문서 클릭 이벤트에 의해 트리거될 수 있습니다
* @param {Object} "대상 객체"
*/
$(문서).click(함수(e){
$("대상 객체").hide();
});
/**
* 하지만 한 가지 단점은 요소를 클릭하면 표시되기를 원한다는 것입니다
* 전역 시작 문서 객체까지 이벤트가 버블링되는 것을 시간 내에 막지 않으면 위 메소드가 실행됩니다
*/
$("대상 개체").click(function(event){
이벤트 = 이벤트 || window.event;
Event.stopPropagation(); // 대상 객체를 클릭하면 시간에 따른 이벤트 버블링을 중지합니다.
$("대상 객체").toggle();
});
위 내용은 제가 직접 개발하는 동안 쉽게 사용할 수 있도록 컴파일한 몇 가지 자주 사용되는 자바스크립트 방법입니다. 또한 도움이 필요한 친구들에게도 추천합니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
