JavaScript：函数、函数表达式、对象、方法和 this-js教程-PHP中文网

JavaScript：函数、函数表达式、对象、方法和 this

王林

发布： 2024-08-07 10:43:23

原创

889 人浏览过

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

简单的基本功能

这是一个不带参数的简单函数：

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

hello();

登录后复制

这是一个带有一个参数的函数：

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

greet('Megan');

登录后复制

我们可以有多个参数，如下所示：

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

greetFullName('Megan', 'Paffrath');

登录后复制

函数表达式

函数表达式只是编写函数的另一种方式。它们的工作方式仍然与上面相同：

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

square(2); // 4

登录后复制

高阶函数

这些函数与其他函数一起运行/在其他函数上运行，也许它们：

接受其他函数作为参数
返回一个函数

将另一个函数作为参数的函数的示例是：

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

登录后复制

函数返回函数的示例是：

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();

登录后复制

另一个（更有用的例子）是：

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

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

登录后复制

方法

我们可以添加函数作为对象的属性（这些称为方法）。

例如：

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

登录后复制

这

“this”主要在对象的方法中使用。它用于引用对象的属性。

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

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

登录后复制

注意，在对象之外，“this”指的是顶级窗口对象。要查看其中包含的内容，请在控制台中输入此内容。通用函数也存储在 this 对象中：

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

this.howdy(); // HOWDY

登录后复制

以上是JavaScript：函数、函数表达式、对象、方法和 this的详细内容。更多信息请关注PHP中文网其他相关文章！