JavaScriptのさまざまなメソッド

May 09, 2023 pm 01:46 PM

JavaScript は、Web 開発、ゲーム開発、モバイル アプリケーション開発などのさまざまな分野で使用できる、広く使用されているプログラミング言語です。メソッドは JavaScript 開発の非常に重要な部分です。この記事では、JavaScript のさまざまなメソッドを紹介し、例を通してこれらのメソッドの応用を示します。

パート 1: 基本メソッド

  1. alert() メソッド

alert() メソッドは、ブラウザ ページにダイアログ ボックスをポップアップするために使用されます。通常、ユーザーに情報や警告を表示するために使用されます。

構文:

alert("メッセージ");

例:

alert("私の Web サイトへようこそ!");

  1. prompt() メソッド

prompt() メソッドは、ユーザーに情報の入力を求めるダイアログ ボックスをポップアップ表示するために使用されます。ユーザーが入力した値 (文字列型) を返します。

構文:

prompt("message","default value");

例:

let name = prompt("名前を入力してください: ","Zhang San");

  1. console.log() メソッド

console.log() メソッドは、コードをデバッグするときに最も一般的に使用されるメソッドです。コンソールに情報を出力します。文字列、変数、オブジェクト、配列などの型のデータを出力できます。

構文:

console.log("message");

例:

let num = 10;
console.log("番号は「 num);

  1. parseInt() メソッド

parseInt() メソッドは、文字列を整数型に変換するために使用されます。変換できない場合は NaN が返されます。

構文:

parseInt(string, radix);

string: 整数に変換される文字列。

radix: 基数変換、オプション。設定されていない場合、デフォルトは 10 です。

例:

let str = "123";
let num = parseInt(str);
console.log(num); //123

  1. parseFloat() メソッド

parseFloat() メソッドは、文字列を浮動小数点数型に変換するために使用されます。変換できない場合は NaN が返されます。

構文:

parseFloat(string);

string: 浮動小数点数に変換される文字列。

例:

let str = "3.14";
let num = parseFloat(str);
console.log(num); //3.14

パート 2: 配列メソッド

  1. push() メソッドと Pop() メソッド

push() メソッドは配列の最後に要素を追加するために使用されます。 Pop() メソッド 配列の末尾の要素を削除するために使用されます。

構文:

push(newelement);

pop();

例:

let Fruits = ["Apple" ,"バナナ","オレンジ"];
fruits.push("グレープ");
console.log(フルーツ); //["アップル","バナナ","オレンジ","グレープ" ]
fruits.pop();
console.log(fruits); //["Apple","Banana","Orange"]

  1. shift() と unshift( )メソッド

shift() メソッドは配列の先頭にある要素を削除するために使用され、unshift() メソッドは配列の先頭に要素を追加するために使用されます。

構文:

shift();

unshift(newelement);

例:

let Fruits = ["Apple" ,"バナナ","オレンジ"];
fruits.unshift("ブドウ");
console.log(フルーツ); //["ブドウ","リンゴ","バナナ","オレンジ" ]
fruits.shift();
console.log(fruits); //["Apple","Banana","Orange"]

  1. slice() メソッド

slice() メソッドは、配列から要素のセグメントをインターセプトするために使用されます。元の配列は変更されませんが、新しい配列が返されることに注意してください。

構文:

slice(start, end);

start: この位置を含む開始位置。

end: この位置を除く終了位置。

end を省略した場合、配列の開始位置から末尾までインターセプトされます。

例:

let Fruits = ["Apple","Banana","Orange","Grape"];
let newfruits = Fruits.slice(1,3);
console.log(newfruits); //["Banana","Orange"]

パート 3: 文字列メソッド

  1. toUpperCase() メソッドと toLowerCase() メソッド
#toUpperCase() メソッドは文字列を大文字形式に変換するために使用され、toLowerCase() メソッドは文字列を小文字形式に変換するために使用されます。

構文:

toUpperCase();

toLowerCase();

例:

let str = "Hello World";

let newsstr1 = str.toUpperCase();
let newsstr2 = str.toLowerCase();
console.log(newstr1); //"HELLO WORLD"
console.log(newstr2); //「hello world」

    indexOf() メソッドと lastIndexOf() メソッド
indexOf() メソッドは、指定された文字または文字列の位置を取得するために使用されます。弦。見つからない場合は -1 を返します。 lastIndexOf() メソッドは、indexOf() メソッドに似ていますが、文字列の末尾から検索を開始します。

構文:

indexOf(searchvalue, start);

searchvalue: 検索する値。文字または文字列にすることができます。

start: オプションのパラメータ。どのインデックスから検索を開始するか。

lastIndexOf(searchvalue, start);

例:

let str = "Hello World";

let pos1 = str.indexOf("l");
let pos2 = str.lastIndexOf("l");
console.log(pos1); //2
console.log(pos2); //9

    concat() メソッド
concat() メソッドは、複数の文字列を連結して新しい文字列を生成するために使用されます。

構文:

concat(string1, string2, ..., stringn);

例:

let str1 = "Hello";

let str2 = "World";
let str3 = str1.concat(" ", str2);
console.log(str3); //"Hello World"

パート 4: オブジェクト方法###
  1. keys() メソッドと value() メソッド

keys() メソッドはオブジェクト内のすべてのキーを取得するために使用され、values() メソッドはすべてのキーを取得するために使用されます。オブジェクト内の値。どちらも配列を返します。

構文:

Object.keys(オブジェクト);

Object.values(オブジェクト);

例:

let obj = {name:"Zhang San",age:18,city:"Beijing"};
let キー = Object.keys(obj);
let 値 = Object.values(obj);
console .log(keys); //["name","age","city"]
console.log(values); //["Zhang San",18,"Beijing"]

  1. toString() メソッド

toString() メソッドは、オブジェクトを文字列に変換するために使用され、デバッグやロギングによく使用されます。

構文:

object.toString();

例:

let obj = {name:"张三",age:18,city :"北京"};
console.log(obj.toString()); //"[オブジェクト オブジェクト]"

  1. hasOwnProperty() メソッド

hasOwnProperty() メソッドは、オブジェクトに特定のプロパティが存在するかどうかを確認するために使用されます。存在する場合は true を返し、存在しない場合は false を返します。

構文:

object.hasOwnProperty(property);

property: チェックするプロパティの名前。

例:

let obj = {name:"Zhang San",age:18,city:"Beijing"};
console.log(obj.hasOwnProperty("name" )); //true
console.log(obj.hasOwnProperty("gender")); //false

パート 5: Date メソッド

  1. Date() メソッド

Date() メソッドは、日付と時刻を取得または設定するために使用されます。パラメータが渡されない場合は、現在の日付と時刻が返されます。

構文:

new Date();

例:

let date = new Date();
console.log(date) ; //水曜日 8 月 04 2021 15:41:10 GMT 0800 (中国標準時)

  1. getDate()、getMonth()、および getFull Year() メソッド

getDate () メソッドは現在の日付 (各月の日) を取得するために使用され、getMonth() メソッドは現在の月 (0 は 1 月を意味し、11 は 12 月を意味します) を取得するために使用されます。現在の月と年を取得します。

#構文:

getDate();

getMonth();

getFullyear();

例:

let date = new Date();

let day = date.getDate();
let month = date.getMonth() 1;
let year = date.getFull Year();
console.log(year "-" month "-" day); //"2021-8-4"

概要:

この記事では、コンソールでよく使われる基本的なメソッドと配列メソッドを紹介します。 JavaScript 、文字列メソッド、オブジェクト メソッド、日付メソッド、および対応する例を示し、読者の役に立つことを願っています。もちろん、JavaScript にはこれら以外にもメソッドがたくさんありますので、さらに詳しく知りたい場合は、さらに多くのドキュメントや参考書を参照して実践することをお勧めします。

以上がJavaScriptのさまざまなメソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホット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 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

HTMLにおけるReactの役割:ユーザーエクスペリエンスの向上 HTMLにおけるReactの役割:ユーザーエクスペリエンスの向上 Apr 09, 2025 am 12:11 AM

ReactはJSXとHTMLを組み合わせてユーザーエクスペリエンスを向上させます。 1)JSXはHTMLを埋め込み、開発をより直感的にします。 2)仮想DOMメカニズムは、パフォーマンスを最適化し、DOM操作を削減します。 3)保守性を向上させるコンポーネントベースの管理UI。 4)国家管理とイベント処理は、インタラクティブ性を高めます。

反応コンポーネント:HTMLで再利用可能な要素を作成します 反応コンポーネント:HTMLで再利用可能な要素を作成します Apr 08, 2025 pm 05:53 PM

Reactコンポーネントは、機能またはクラスによって定義され、UIロジックのカプセル化、およびプロップを介して入力データを受け入れることができます。 1)コンポーネントの定義:関数またはクラスを使用して、反応要素を返します。 2)レンダリングコンポーネント:Reactコールレンダリングメソッドまたは機能コンポーネントを実行します。 3)マルチプレックスコンポーネント:データをプロップに渡して、複雑なUIを構築します。コンポーネントのライフサイクルアプローチにより、ロジックをさまざまな段階で実行でき、開発効率とコードメンテナビリティが向上します。

ReactとFrontend:インタラクティブエクスペリエンスの構築 ReactとFrontend:インタラクティブエクスペリエンスの構築 Apr 11, 2025 am 12:02 AM

Reactは、インタラクティブなフロントエンドエクスペリエンスを構築するための好ましいツールです。 1)Reactは、コンポーネント化と仮想DOMを通じてUIの開発を簡素化します。 2)コンポーネントは、関数コンポーネントとクラスコンポーネントに分割されます。関数コンポーネントはよりシンプルで、クラスコンポーネントはより多くのライフサイクル方法を提供します。 3)Reactの作業原則は、パフォーマンスを改善するために仮想DOMおよび調整アルゴリズムに依存しています。 4)国家管理は、usestateまたはthis.stateを使用し、ComponentDidmountなどのライフサイクルメソッドが特定のロジックに使用されます。 5)基本的な使用には、コンポーネントの作成と状態の管理が含まれ、高度な使用にはカスタムフックとパフォーマンスの最適化が含まれます。 6)一般的なエラーには、不適切なステータスの更新とパフォーマンスの問題が含まれます。

Arrayおよびオブジェクトの変更に関するVUE 2の反応性システムの制限は何ですか? Arrayおよびオブジェクトの変更に関するVUE 2の反応性システムの制限は何ですか? Mar 25, 2025 pm 02:07 PM

VUE 2の反応性システムは、直接配列インデックス設定、長さの変更、およびオブジェクトプロパティの追加/削除と闘っています。開発者は、Vueの突然変異法とVue.set()を使用して、反応性を確保することができます。

TypeScriptをReactで使用することの利点は何ですか? TypeScriptをReactで使用することの利点は何ですか? Mar 27, 2025 pm 05:43 PM

タイプスクリプトは、タイプの安全性を提供し、コードの品質を改善し、IDEサポートを改善し、エラーを減らし、保守性を向上させることにより、反応開発を促進します。

複雑な州管理にusereducerを使用するにはどうすればよいですか? 複雑な州管理にusereducerを使用するにはどうすればよいですか? Mar 26, 2025 pm 06:29 PM

この記事では、Reactで複雑な状態管理にusereducerを使用して、useStateよりもその利点と副作用のために使用するEffectと統合する方法を詳述しています。

Vue.jsの機能コンポーネントとは何ですか?彼らはいつ役に立ちますか? Vue.jsの機能コンポーネントとは何ですか?彼らはいつ役に立ちますか? Mar 25, 2025 pm 01:54 PM

VUE.JSの機能コンポーネントは、無国籍で軽量で、ライフサイクルフックがないため、純粋なデータのレンダリングとパフォーマンスの最適化に最適です。状態または反応性を持たないことにより、ステートフルコンポーネントとは異なり、レンダリング関数を直接使用します。

Reactコンポーネントにアクセスできるようにするにはどうすればよいですか?どのツールを使用できますか? Reactコンポーネントにアクセスできるようにするにはどうすればよいですか?どのツールを使用できますか? Mar 27, 2025 pm 05:41 PM

この記事では、セマンティックHTML、ARIA属性、キーボードナビゲーション、カラーコントラストに焦点を当てて、反応コンポーネントにアクセスできるようにするための戦略とツールについて説明します。 Eslint-Plugin-JSX-A11yやAxe-Coreなどのツールを使用することをお勧めします。

See all articles