> 웹 프론트엔드 > JS 튜토리얼 > 통화신청 및 자바스크립트로 신청

통화신청 및 자바스크립트로 신청

php中世界最好的语言
풀어 주다: 2018-03-14 13:30:03
원래의
1425명이 탐색했습니다.

이번에는 javascript로 호출 및 신청을 가져왔는데, javascript로 호출 및 신청 시 주의사항은 무엇인지, 다음은 실제 사례로 살펴보겠습니다.

배열의 최대값과 최소값 찾기

배열 정의:

var ary = [23, 34, 24, 12, 35, 36, 14, 25];
로그인 후 복사

정렬 후 값 방법

먼저 배열을 정렬합니다(소형 -> 대형). 첫 번째와 마지막 항목이 우리가 원하는 최소값입니다. 그리고 최대값.

var ary = [23, 34, 24, 12, 35, 36, 14, 25];
ary.sort(function (a, b) {
    return a - b;
});var min = ary[0];var max = ary[ary.length - 1];
console.log(min, max);1234567
로그인 후 복사

가설 방법

현재 배열의 첫 번째 값이 최대값이라고 가정하고, 이 값을 다음 항목과 하나씩 비교합니다. 후자의 값 중 하나가 가정한 값보다 높으면, 가정이 틀렸다는 뜻입니다. 가정된 값을 대체합니다...

var max = ary[0], min = ary[0];for (var i = 1; i < ary.length; i++) {
    var cur = ary[i];
    cur > max ? max = cur : null;
    cur < min ? min = cur : null;
}
console.log(min, max);1234567
로그인 후 복사

Math에서 max/min 방식을 구현했습니다(apply를 통해)

Math.min을 직접 사용하세요

var min = Math.min(ary); 
console.log(min); // NaN 
console.log(Math.min(23, 34, 24, 12, 35, 36, 14, 25));
로그인 후 복사

Math.min을 직접 사용할 때 필요합니다. 비교할 숫자 더미를 하나씩 추가하려면 최종 단점을 얻으려면 한 번에 ary 배열을 넣을 수 없습니다.

해 보세요: eval

var max = eval(“Math.max(” + ary.toString() + “)”); 
console.log(max); 
var min = eval(“Math.min(” + ary.toString() + “)”); 
console.log(min); 
“Math.max(” + ary.toString() + “)” –> “Math.max(23,34,24,12,35,36,14,25)”
로그인 후 복사
를 사용하세요

먼저 다른 것에 대해 걱정하지 마세요. 먼저 실행하려는 마지막 코드를 string으로 바꾼 다음 배열의 각 항목 값을 이 문자열에 연결하세요.

eval: 실행을 위해 문자열을 JavaScript 표현식으로 변환
예: eval("12+23+34+45") // 114

apply를 통해 Math에서 max/min을 호출

var max = Math.max.apply(null, ary); 
var min = Math.min.apply(null, ary); 
console.log(min, max);
로그인 후 복사

비엄격하게 모드에서는 적용할 첫 번째 매개변수가 null인 경우 max/min의 이것이 window를 가리킨 다음 ary 매개변수가 하나씩 max/min에 전달됩니다.

평균 계산

이제 시나리오를 시뮬레이션하고 특정 대회를 진행합니다. 심사위원은 점수를 매긴 후 가장 높은 점수와 가장 낮은 점수를 제거해야 하며 나머지 점수의 평균이 최종 점수가 됩니다.

아마도 많은 학생들이 모든 점수를 받는 메소드를 작성하고 함수의 내장 속성 인수를 사용하여 sort 메소드를 호출하여 인수를 정렬하는 것을 생각할 것입니다. 그러나 인수는 는 실제 배열 객체가 아니며 의사 배열의 모음일 뿐이므로 인수를 사용하여 정렬 메서드를 직접 호출하면 오류가 보고됩니다.

arguments.sort(); // Uncaught TypeError: arguments.sort is not a function
로그인 후 복사


따라서 이때 인수를 먼저 실제 배열로 변환할 수 있나요? 그런 다음 작업을 수행하시겠습니까? 이 아이디어에 따라 질문의 요구 사항을 충족하는 비즈니스 메서드를 구현했습니다.

function avgFn() {
    // 1、将类数组转换为数组:把arguments克隆一份一模一样的数组出来
    var ary = [];    for (var i = 0; i < arguments.length; i++) {
        ary[ary.length] = arguments[i];
    }    // 2、给数组排序,去掉开头和结尾,剩下的求平均数
    ary.sort(function (a, b) {
        return a - b;
    });
    ary.shift();
    ary.pop();    return (eval(ary.join(&#39;+&#39;)) / ary.length).toFixed(2);
}var res = avgFn(9.8, 9.7, 10, 9.9, 9.0, 9.8, 3.0);
console.log(res);1234567891011121314151617
로그인 후 복사

우리는 배열을 생성하기 위해 인수를 복제하기 위해 구현한 avgFn 메서드에 단계가 있음을 발견했습니다. 배열의 슬라이스 메소드에 익숙하다면, 슬라이스 메소드에 매개변수가 전달되지 않으면 현재 배열이 복제된다는 것을 알 수 있습니다. 이는 다음과 같이 시뮬레이션할 수 있습니다.

function mySlice () {
    // this->当前要操作的这个数组ary
    var ary = [];    for (var i = 0; i < this.length; i++) {
        ary[ary.length] = this[i];
    }    return ary;
};var ary = [12, 23, 34];var newAry = mySlice(ary);
console.log(newAry);1234567891011
로그인 후 복사

그래서 인수를 배열로 변환하는 작업은 다음과 같습니다. avgFn 메소드는 다음과 같이 수행할 수 있습니다. 호출 메소드는 Array의 슬라이스 메소드를 차용합니다.

function avgFn() { // 1、将类数组转换为数组:把arguments克隆一份一模一样的数组出来 // var ary = Array.prototype.slice.call(arguments); var ary = [].slice.call(arguments);
// 2、给数组排序,去掉开头和结尾,剩下的求平均数....123
}
로그인 후 복사

현재 접근 방식은 먼저 인수를 배열로 변환한 다음 변환된 배열을 연산하는 것입니다. 그러면 먼저 배열로 변환하는 대신 인수를 직접 사용할 수 있나요? 물론 가능하며, 호출을 통해 배열 방식을 빌려서 구현 가능합니다.

function avgFn() {
    Array.prototype.sort.call(arguments , function (a, b) {
        return a - b;
    });
    [].shift.call(arguments);
    [].pop.call(arguments);    return (eval([].join.call(arguments, &#39;+&#39;)) / arguments.length).toFixed(2);
}var res = avgFn(9.8, 9.7, 10, 9.9, 9.0, 9.8, 3.0);
console.log(res);123456789101112
로그인 후 복사

Convert Array-like to Array

앞서 배열의 슬라이스 메소드를 사용하여 배열 유사 객체를 배열로 변환할 수 있다고 말씀드렸습니다. 따라서 getElementsByTagName 등을 통해 얻은 배열 유사 객체도 가능합니다. 메서드도 슬라이스 메서드를 빌려 배열로 변환할 수 있나요?

var oLis = document.getElementsByTagName('div');
var ary = Array.prototype.slice.call(oLis);
console.log(ary); IE6~8에서는 비극이 발생하고 오류가 보고됩니다:

SCRIPT5014: Array.prototype.slice: 'this'는 JavaScript 개체가 아닙니다(오류 보고)

그러면 IE6~8에서는 추가만 가능합니다 루프를 통해 하나씩 배열에 추가합니다.

for (var i = 0; i < oLis.length; i++) { 
ary[ary.length] = oLis[i]; 
}
로그인 후 복사

참고: 인수로 배열을 빌리는 방법에는 호환성 문제가 없습니다.


IE6~8과 표준 브라우저의 차이점을 토대로 배열형 객체를 배열로 변환하는 도구 클래스를 추출합니다.

function listToArray(likeAry) {
    var ary = [];    try {
        ary = Array.prototype.slice.call(likeAry);
    } catch (e) {        for (var i = 0; i < likeAry.length; i++) {
            ary[ary.length] = likeAry[i];
        }
    }    return ary;
}1234567891011
로그인 후 복사

이 도구 방법은 브라우저의 예외 정보 캡처를 사용하므로 여기서 소개하겠습니다.

console.log(num);

정의되지 않은 변수를 출력하면 오류가 보고됩니다: Uncaught ReferenceError: num is not Defined JavaScript에서 이 줄은 오류를 보고하고 다음 코드는 더 이상 실행되지 않습니다. .

그러나 try..catch를 사용하여 예외 정보를 캡처하면 다음 코드의 실행에 영향을 주지 않습니다. try에서 코드 실행 중 오류가 발생하면 기본적으로 try in catch가 실행됩니다.

console.log(num); 
} catch (e) { // 形参必须要写,我们一般起名为e 
console.log(e.message); // –> num is not defined 可以收集当前代码报错的原因 
} 
console.log(‘ok’);
로그인 후 복사

그래서 시도해 보세요 ...catch의 사용 형식은 (Java와 매우 유사):

try { 
// 
} catch (e) { 
// 如果代码报错执行catch中的代码 
} finally { 
// 一般不用:不管try中的代码是否报错,都要执行finally中的代码 
}
로그인 후 복사

이번에는 정보를 캡처하고 싶지만 다음 diamante가 실행되는 것을 원하지 않으므로 어떻게 해야 합니까?

try {    console.log(num);
} catch (e) {    // console.log(e.message); // --> 可以得到错误信息,把其进行统计    // 手动抛出一条错误信息,终止代码执行    throw new Error(&#39;当前网络繁忙,请稍后再试&#39;);    // new ReferenceError --> 引用错误    // new TypeError --> 类型错误    // new RangeError --> 范围错误
}console.log(&#39;ok&#39;);
로그인 후 복사

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 도서:

JavaScript에서 호출, 적용, 바인딩의 차이점은 무엇인가요

자바스크립트 호출에 대한 자세한 설명

위 내용은 통화신청 및 자바스크립트로 신청의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿