検索
ホームページウェブフロントエンドjsチュートリアルJavaScriptでの呼び出しと適用のアプリケーション

今回は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

仮説法

現在の配列の最初の値が最大値であると仮定し、この値を次の項目と 1 つずつ比較し、後者の値のいずれかが仮定された値より大きい場合、それを仮定します。仮定が間違っていることを意味します。仮定された値を置き換えます...

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 を直接使用する場合は、比較する数値の山を追加するには 1 つずつ渡して、最終的なデメリットを取得します。 配列配列を一度に入れることはできません。

試してみましょう: 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 に変換してから、配列内の各項目の値をこの string に結合します。

eval: 文字列を実行用の JavaScript 式に変換します
例: eval("12+23+34+45") // 114

apply

var max = Math.max.apply(null, ary); 
var min = Math.min.apply(null, ary); 
console.log(min, max);

In non-strict を通じて Math の max/min を呼び出しますモードでは、適用する最初のパラメータが null の場合、max/min の this は window を指し、次に ary パラメータが 1 つずつ max/min に渡されます。

平均を計算します

次に、シナリオをシミュレーションし、特定の競技を実施します。審査員は得点した後、最高得点と最低得点を削除する必要があります。残りの得点の平均が最終得点となります。

おそらく多くの学生は、すべてのスコアを受け取るメソッドを作成し、関数の組み込み属性引数を使用して、sort メソッドを呼び出して引数を並べ替えてから…と考えるでしょうが、引数には注意してください。は実際の配列オブジェクトではなく、単なる疑似配列のコレクションであるため、引数を使用して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 メソッドに、引数を複製して配列を生成するステップがあることがわかりました。配列のスライス メソッドに精通している場合は、パラメータがスライス メソッドに渡されない場合、現在の配列が複製されることがわかります。これは次のようにシミュレートできます。 avgFnメソッドはArray内のsliceメソッドを借用することで実現できます。

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

現在のアプローチは、最初に引数を配列に変換してから、変換された配列を操作することです。では、最初に引数を配列に変換する代わりに、引数を直接使用することはできますか? もちろん、呼び出して配列メソッドを借用することも可能です。

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

配列のようなオブジェクトを配列に変換する

配列のスライスメソッドを使用して配列のようなオブジェクトを配列に変換すると述べましたが、

getElementsByTagName

などを通じて取得した配列のようなオブジェクトも同様に変換できます。メソッドもスライスメソッドを借用して配列に変換できます。配列オブジェクトについてはどうでしょうか? var oLis = document.getElementsByTagName('div');

var ary = Array.prototype.slice.call(oLis);

console.log(ary); IE6~8 では悲劇となり、エラーが報告されます:

SCRIPT5014: Array.prototype.slice: 'this' is not a JavaScript object (error reports)
その後、IE6~8 では追加することしかできません。ループを通じて 1 つずつ配列に追加します:

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

注: 引数として配列を借用する方法には互換性の問題はありません。

IE6~8と標準ブラウザの違いを踏まえて、配列状のオブジェクトを配列に変換するツールクラスを抽出します:

for (var i = 0; i < oLis.length; i++) { 
ary[ary.length] = oLis[i]; 
}

このツールメソッドはブラウザの例外情報キャプチャを利用しているので、ここで紹介しましょう。

console.log(num);

未定義の変数を出力すると、Uncaught ReferenceError: num が定義されていないというエラーが報告され、次のコードは実行されなくなります。 。

ただし、try..catch を使用して例外情報を取得した場合、次のコードの実行には影響しません。try のコードの実行でエラーが発生した場合、デフォルトで catch の try が実行されます。

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

それでは試してみてください ...catch の使用形式は (Java に非常によく似ています):


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

このとき、情報をキャプチャしたいのですが、次の Diamante を実行したくないので、どうすればいいですか?

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

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

JavaScript の call、apply、bind の違いは何ですか

JavaScriptでの呼び出しの詳しい説明

以上がJavaScriptでの呼び出しと適用のアプリケーションの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
Python vs. JavaScript:ジョブに適したツールを選択するPython vs. JavaScript:ジョブに適したツールを選択するMay 08, 2025 am 12:10 AM

PythonまたはJavaScriptを選択するかどうかは、プロジェクトの種類によって異なります。1)データサイエンスおよび自動化タスクのPythonを選択します。 2)フロントエンドとフルスタック開発のためにJavaScriptを選択します。 Pythonは、データ処理と自動化における強力なライブラリに好まれていますが、JavaScriptはWebインタラクションとフルスタック開発の利点に不可欠です。

PythonとJavaScript:それぞれの強みを理解するPythonとJavaScript:それぞれの強みを理解するMay 06, 2025 am 12:15 AM

PythonとJavaScriptにはそれぞれ独自の利点があり、選択はプロジェクトのニーズと個人的な好みに依存します。 1. Pythonは、データサイエンスやバックエンド開発に適した簡潔な構文を備えた学習が簡単ですが、実行速度が遅くなっています。 2。JavaScriptはフロントエンド開発のいたるところにあり、強力な非同期プログラミング機能を備えています。 node.jsはフルスタックの開発に適していますが、構文は複雑でエラーが発生しやすい場合があります。

JavaScriptのコア:CまたはCの上に構築されていますか?JavaScriptのコア:CまたはCの上に構築されていますか?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc;それは、解釈されていることを解釈しました。

JavaScriptアプリケーション:フロントエンドからバックエンドまでJavaScriptアプリケーション:フロントエンドからバックエンドまでMay 04, 2025 am 12:12 AM

JavaScriptは、フロントエンドおよびバックエンド開発に使用できます。フロントエンドは、DOM操作を介してユーザーエクスペリエンスを強化し、バックエンドはnode.jsを介してサーバータスクを処理することを処理します。 1.フロントエンドの例:Webページテキストのコンテンツを変更します。 2。バックエンドの例:node.jsサーバーを作成します。

Python vs. Javascript:どの言語を学ぶべきですか?Python vs. Javascript:どの言語を学ぶべきですか?May 03, 2025 am 12:10 AM

PythonまたはJavaScriptの選択は、キャリア開発、学習曲線、エコシステムに基づいている必要があります。1)キャリア開発:Pythonはデータサイエンスとバックエンド開発に適していますが、JavaScriptはフロントエンドおよびフルスタック開発に適しています。 2)学習曲線:Python構文は簡潔で初心者に適しています。 JavaScriptの構文は柔軟です。 3)エコシステム:Pythonには豊富な科学コンピューティングライブラリがあり、JavaScriptには強力なフロントエンドフレームワークがあります。

JavaScriptフレームワーク:最新のWeb開発のパワーJavaScriptフレームワーク:最新のWeb開発のパワーMay 02, 2025 am 12:04 AM

JavaScriptフレームワークのパワーは、開発を簡素化し、ユーザーエクスペリエンスとアプリケーションのパフォーマンスを向上させることにあります。フレームワークを選択するときは、次のことを検討してください。1。プロジェクトのサイズと複雑さ、2。チームエクスペリエンス、3。エコシステムとコミュニティサポート。

JavaScript、C、およびブラウザの関係JavaScript、C、およびブラウザの関係May 01, 2025 am 12:06 AM

はじめに私はあなたがそれを奇妙に思うかもしれないことを知っています、JavaScript、C、およびブラウザは正確に何をしなければなりませんか?彼らは無関係であるように見えますが、実際、彼らは現代のウェブ開発において非常に重要な役割を果たしています。今日は、これら3つの間の密接なつながりについて説明します。この記事を通して、JavaScriptがブラウザでどのように実行されるか、ブラウザエンジンでのCの役割、およびそれらが協力してWebページのレンダリングと相互作用を駆動する方法を学びます。私たちは皆、JavaScriptとブラウザの関係を知っています。 JavaScriptは、フロントエンド開発のコア言語です。ブラウザで直接実行され、Webページが鮮明で興味深いものになります。なぜJavascrを疑問に思ったことがありますか

node.jsは、型を使用してストリーミングしますnode.jsは、型を使用してストリーミングしますApr 30, 2025 am 08:22 AM

node.jsは、主にストリームのおかげで、効率的なI/Oで優れています。 ストリームはデータを段階的に処理し、メモリの過負荷を回避します。大きなファイル、ネットワークタスク、リアルタイムアプリケーションの場合。ストリームとTypeScriptのタイプの安全性を組み合わせることで、パワーが作成されます

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

WebStorm Mac版

WebStorm Mac版

便利なJavaScript開発ツール

VSCode Windows 64 ビットのダウンロード

VSCode Windows 64 ビットのダウンロード

Microsoft によって発売された無料で強力な IDE エディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい