JavaScript : fonctions, expressions de fonction, objets, méthodes, etc.-js tutoriel-php.cn

JavaScript : fonctions, expressions de fonction, objets, méthodes, etc.

王林

Libérer： 2024-08-07 10:43:23

original

885 Les gens l'ont consulté

JavaScript: Functions, Function Expressions, Objects, Methods, and this

Fonction de base simple

Voici une fonction simple qui ne prend aucun argument :

function hello() {
  console.log('Hello there stranger, how are you?');
}

hello();

Copier après la connexion

Voici une fonction qui prend un argument :

function greet(person) {
  console.log(`Hi there ${person}.`);
}

greet('Megan');

Copier après la connexion

Nous pouvons avoir plus d'un argument comme suit :

function greetFullName(fName, lName) {
  console.log(`Hi there ${fName} ${lName}.`);
}

greetFullName('Megan', 'Paffrath');

Copier après la connexion

Expressions de fonction

Les expressions de fonction ne sont qu'une autre façon d'écrire des fonctions. Ils fonctionnent toujours de la même manière que ci-dessus :

const square = function(x) {
   return x * x;
};

square(2); // 4

Copier après la connexion

Fonctions d'ordre supérieur

Ces fonctions fonctionnent avec/sur d'autres fonctions, peut-être qu'elles :

accepter d'autres fonctions comme arguments
retourner une fonction

Un exemple de fonction prenant une autre fonction comme argument est :

function callTwice(func) {
  func();
  func();
}

let laugh = function () {
  console.log('haha');
};

callTwice(laugh);
// haha
// haha

function rollDie() {
  const roll = Math.floor(Math.random() * 6) + 1;
  console.log(roll);
}

callTwice(rollDie);
// random number
// random number

Copier après la connexion

Un exemple de fonction renvoyant une fonction est :

function makeMysteryFunc() {
  const rand = Math.random();
  if (rand > 0.5) {
    return function () {
      console.log('You win');
    };
  } else {
    return function () {
      alert('You have been infected by a computer virus');
      while (true) {
        alert('Stop trying to close this window.');
      }
    };
  }
}

let returnedFunc = makeMysteryFunc();
returnedFunc();

Copier après la connexion

Un autre exemple (plus utile) est :

function makeBetweenFunc(min, max) {
  return function (num) {
    return num >= min && num <= max;
  };
}

const isBetween = makeBetweenFunc(100, 200);
// isBetween(130); // true
// isBetween(34); // false

Copier après la connexion

Méthodes

Nous pouvons ajouter des fonctions comme propriétés sur les objets (c'est ce qu'on appelle des méthodes).

Ex :

const myMath = {
  PI: 3.14,
  square: function (num) {
    return num * num;
  },
  // note the 2 diff ways of defining methods
  cube(num) {
    return num ** 3;
  },
};

Copier après la connexion

Ce

'this' est principalement utilisé DANS les méthodes des objets. Il est utilisé pour référencer les propriétés de l'objet.

const person = {
  first: 'Abby',
  last: 'Smith',
  fullName() {
    return `${this.first} ${this.last}`;
  },
};

person.fullName(); // "Abby Smith"
person.lastName = 'Elm';
person.fullName(); // "Abby Elm"

Copier après la connexion

Notez qu'en dehors des objets, « this » fait référence à l'objet fenêtre de niveau supérieur. Pour voir ce que cela contient, entrez-le dans la console. Les fonctions générales sont également stockées dans cet objet :

// defined on its own (outside of an object)
function howdy() {
  console.log('HOWDY');
}

this.howdy(); // HOWDY

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!