検索
ホームページウェブフロントエンドjsチュートリアルJavaScriptの基礎知識集(2) おすすめ集_基礎知識

添付の例を詳しく見てください。比較的簡単に記述できます。


1. Cookie の機能について:

コードをコピーします コードは次のとおりです。以下のように:

/**
* Cookie 操作ツール
* 使用方法: Save value: CookieTool('name','1',{expires: 7}) //値が 1、キー値が の Cookie を保存することを示します。 name は無効です。時刻 7 日後
* 値: CookieTool('name') //Return 1
* @param {} name
* @param {} value
* @param {} オプション
* @return {}
*/
CookieTool = function(name, value, options) {
if (typeof value != 'unknown') {
options = オプション || {};
if (value === null) {
options.expires = -1;
var 期限切れ = ' ';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date;
if (typeof options.expires == 'number) ') {
date = new Date();
date.setTime(date.getTime() (options.expires * 24 * 60 * 60 * 1000)); else {
date = オプション .expires;
expires=' date.toUTCString();
}
var path = options.path='; '' ;
var ドメイン = options.domain ? '; ドメイン=' (options.domain) : '';
var secure = options.secure' : ''; cookie = [名前, '=', encodeURIComponent(value), 期限切れ, パス, ドメイン, セキュア].join('');
} else {
var cookieValue = null; cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i var cookie = トリム(cookies[i]);
if (cookie.substring(0, name.length 1) == (name '=')) {
cookieValue = decodeURIComponent(cookie.substring(name) .length 1));
break;
}
}
return cookieValue;



2. js オブジェクトを表示できる js 関数に関するクールなメソッド:





コードをコピー

コードは次のとおりです
/*** オブジェクトのプロパティを表示するために使用されます */ function debugObjectInfo(obj){ traceObject(obj); function trackObject(obj){
var str = ' ';
if(obj.tagName&&obj.name&&obj.id)
str="else{
str="
";
}
var key=[]; for(var i in obj ){
key.push(i);
key.sort();
for(var i=0;ivar v= new String(obj[key[i]]).replace(/,"/g,">"); ="";
str=str "
" key[i] " " v "
";
writeMsg(str)
}
function trace(v){
var str="
";
str =String(v).replace(/,"/g ,">");
str ="
";
writeMsg(str); >function writeMsg(s) {
traceWin=window.open("","traceWindow","height=600, width=800,scrollbars=yes");
traceWin.document.write(s);
}
}


3. 正規表現:

g はグローバル一致を表します
m は複数行の一致を表します
i は大文字と小文字を区別しない一致を表します
^ 一致を表します入力文字列の
$ は、入力文字列の終了位置と一致します。
* は、前の部分式と 0 回以上一致します。
は、前の部分式と 1 回以上一致します。 1,}
? この文字の後に他の修飾子 (*, , ? , {n}, {n,}, {n, m}) その後、一致パターンは非貪欲になります。非貪欲モードは検索文字列の可能な限り少ない部分と一致しますが、デフォルトの貪欲モードは検索文字列の可能な限り多くの部分と一致します。たとえば、文字列「oooo」の場合、「o ?」は単一の「o」に一致しますが、「o 」はすべての「o」に一致します。

d は、[0-9] と同等の数字に一致します。
D は、[^0-9]
w と同等で、「[A -Za」と同等です。 -z0-9_]"
W は、"[^A-Za-z0-9]" と同等の任意の非単語文字に一致します。
s は、スペース、タブ、フォームフィードなどを含む任意の空白文字に一致します。 to [fnrtv]
S は任意の非空白文字に一致します。 [^frntv]
b は単語の境界、つまり単語とスペースの間の位置に一致します。
B は単語以外の境界に一致します。

正規表現の一般的な js メソッド:
コードをコピー コードは次のとおりです:

/**
* ソース文字列内の要件を満たす部分文字列を検索します。
* @return {}
*/
function MatchDemo() {
var r, re; // 変数を宣言します。
var s = "スペインの雨は主に平地に降ります";
re = new RegExp("ain", "g"); // 正規表現オブジェクトを作成します。
r = s.match(re); // 文字列 s 内で一致を検索します。
return (r);
}

/**
* 正規表現を満たすソース文字列内のすべての文字列と位置情報を返します。*/
function RegExpTest() {
var ver = Number(ScriptEngineMajorVersion() "."
ScriptEngineMinorVersion())
var ans = '';
if (ver >= 5.5) { // JScript のバージョンをテストします。
var src = "スペインの雨は主に平地に降ります。";
var re = /w /g; // 正規表現パターンを作成します。
var arr;
while ((arr = re.exec(src)) != null)
ans = arr.index "-" arr.lastIndex arr "t";
ans = "最新バージョンの JScript を使用してください";
}
return
}

/**
* ソース文字列に対して正規表現チェックを実行して、正規表現に準拠しているかどうかを確認します。*/
function TestDemo() {
var s1;
var source = "abcdefg";
var regex = /w /g; // 正規表現パターンを作成します。
if (regex.test(source))
s1 = " が含まれます。
else
s1 = " が含まれません。
return ("'" ソース "'" s1 " '" regex.source "'");
}

/**
* ソース文字列内の正規表現文字列を検索します。
* @return {}
*/
function SearchDemo() {
var r, re;
var s = "スペインの雨は主に平地に降ります。";
re = /falls/i
r = s.search(re);


4. 優れたメソッド call() を学習して使用する価値があります:

call([thisObj[,arg1[, arg2[, [,.argN]]] ]])
パラメータ
thisObj
オプション。現在のオブジェクトとして使用されるオブジェクト。 arg1、arg2、、、argN
オプション。一連のメソッドパラメータが渡されます。
説明
call メソッドを使用すると、別のオブジェクトの代わりにメソッドを呼び出すことができます。 call メソッドは、関数のオブジェクト コンテキストを初期コンテキストから thisObj で指定された新しいオブジェクトに変更します。

簡単な例:




コードをコピー

コードは次のとおりです: 関数 add (a,b) { alert(a b); function sub(a,b)
{
alert(a-b);
🎜>
add.call(sub,3,1);
//この例の意味は、sub を add に置き換えることです、add.call(sub,3,1) == add(3,1) )、実行結果は次のようになります:alert(4);


少し複雑な例:




コードをコピー

コードは次のとおりです。
function Class1() { this.name = "class1"; this.showNam = function() {
alert(this.name);
}
}

関数 Class2()
{
this.name = "class2";

var c1 = new Class1();
var c2 = new Class2();

c1.showNam.call(c2); c1 のメソッドが c2 で実行されました。c2 には showNam() メソッドがないことがわかり、c1 の showNam() メソッドは実行のために c2 に配置されるため、this.name は class2 になるはずです。は: アラート ("クラス 2");
多重継承の例:
コードをコピー コードは次のとおりです:

関数Class10()
{
this.showSub = function(a,b)
{
alert(a-b);
}
}

function Class11()
{
this.showAdd = function(a,b)
{
alert(a b)
}
}


function Class2();
{
Class10.call(this);
Class11.call(this)
}

5.apply 関数:
Function。apply(obj,args) メソッドは 2 つのパラメーターを受け取ることができます。
obj: このオブジェクトは Function クラスのこのオブジェクトを置き換えます。
args: これは配列であり、パラメーターとして Function に渡されます ( args-->arguments)
呼び出しのような継承の効果を実現します:
コードをコピー コードは次のとおりです。 :

function person(name,age){ // クラス、人間を定義します
this.name=name; //Name
this.age=age
this.sayhello=function(){alert ("hello")};
}
function Print(){ //クラス属性を表示します
this.funcName="Print"; .show=function(){
var msg=[];
for(this の var key){
if(typeof(this[key])!="function"){
msg .push([key,":", this[key]].join(""));
}
}
alert(msg.join(" "));
}
function Student( name,age,grade,school){ //学生クラス
person.apply(this,arguments);
Print.apply(this,arguments); this.grade=grade; //Grade
this.school=school; //school
}
var p1=new Person("jake",10);
var s1=new Student(" tom",13,6,"清華小学校");
s1.sayhello(); );


配列パラメーターの関数を最適化するには、apply を使用します。これはクールなメソッドです:



コードをコピーします

alert(Math.max(5,7,9,3,1,6)) //9

しかし、多くの場合、配列内の最大の要素を見つける必要があります。
var arr=[5,7,9,1]
alert(Math.max(arr)) // これは機能しません。必ず次のように記述してください。

function getMax(arr){
var arrLen=arr.length;
for(var i=0,ret=arr[0];iret=Math.max(ret,arr[i]);
}
return ret;

apply を使用するには、次のコードを参照してください。 🎜>function getMax2( arr){
return Math.max.apply(null,arr);
}


2 つの配列をマージする別の例を次に示します。 >


コードをコピー


コードは次のとおりです:


もう 1 つの例は、配列のプッシュ メソッドです。
var arr1=[1,3,4]; var arr2=[3,4,5]; arr2 を 1 つずつ追加し、最後に arr1 を追加します。 =[1,3,4,3,4,5] arr1.push(arr2) は明らかに機能しません。 これを実行すると [1,3,4,[3,4,5]] が取得されるため、 ループを使用して 1 つずつプッシュすることしかできません (もちろん、arr1.concat(arr2) を使用することもできます)ただし、 concat メソッドは arr1 自体を変更しません) var arrLen=arr2.length
for(var i=0;iarr1.push(arr2[i]);
}


適用を使用するには:




コードをコピーします


コードは次のとおりです。


Array.prototype.push.apply(arr1,arr2)
声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
Python vs. JavaScript:開発者の比較分析Python vs. JavaScript:開発者の比較分析May 09, 2025 am 12:22 AM

PythonとJavaScriptの主な違いは、タイプシステムとアプリケーションシナリオです。 1。Pythonは、科学的コンピューティングとデータ分析に適した動的タイプを使用します。 2。JavaScriptは弱いタイプを採用し、フロントエンドとフルスタックの開発で広く使用されています。この2つは、非同期プログラミングとパフォーマンスの最適化に独自の利点があり、選択する際にプロジェクトの要件に従って決定する必要があります。

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を疑問に思ったことがありますか

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 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

WebStorm Mac版

WebStorm Mac版

便利なJavaScript開発ツール