如何将 JavaScript 函数用作对象?
本教程将教会我们如何将 JavaScript 函数用作**对象**。但是,**函数**、**对象**和**数组**是 JavaScript 中的可变数据类型,所有可变数据类型都是对象。
**JavaScript 对象**是一种包含键值对的实体。它包含唯一的键;每个键都有一些值,这些值可以是任何类型。我们可以使用对象键来访问对象的值。
我们可以创建一个函数,使其表现得像一个对象。下面,我们详细解释了如何将函数转换为对象。
将 JavaScript 函数用作对象
在本节中,我们将学习一些基本知识,使函数在 JavaScript 中能够像对象一样工作。我们可以在函数内部定义变量并初始化键变量的值。要创建新对象,我们将通过在函数内部传递所需的实参来创建对象的实例,以初始化键值。
语法
用户可以按照以下语法将函数用作对象。
普通对象的语法。
let object = {
key : value;
// other key and values
}将函数用作对象的语法。
function funcObject() {
this.key1 = "hello";
this.key2 = "world";
}
Var object = new funcObject();
let value = object.key1; // accessing the object key values参数
**this** - 它是 JavaScript 中的保留关键字。此关键字指的是当前实例的变量、对象或方法。这意味着,如果我们在函数或块内部使用此关键字,它仅指该块的变量。如果我们在代码中全局使用此关键字,它将指全局变量。
示例
在下面的示例中,我们创建了一个单一函数。我们将创建函数的实例并将其用作对象。之后,使用函数的对象,我们将访问函数的变量,就像我们使用键访问普通对象的值一样。
<html>
<head>
<title> JavaScript User defined object </title>
</head>
<body>
<h2> JavaScript function as an object </h2>
<p> Values of the object, after using function as an object. </p>
<div id="value"> </div>
<script>
function funcObject() {
this.name = " tutorialsPoint ";
this.site = " tutorialsPoint.com ";
this.info = " A computer science portal "
}
// Creating the instance of the function to use it as an object.
let newObject = new funcObject();
let values = document.getElementById("value");
values.innerHTML = " name: " + newObject.name + ". <br/>";
values.innerHTML += "site: " + newObject.site + ". <br/>";
values.innerHTML += "info: " + newObject.info + ". <br/>";
</script>
</body>
</html>在上面的示例中,函数的工作方式与对象相同。我们像访问对象键的值一样访问了函数变量,并在屏幕上打印了上述输出。
在函数内部添加参数和方法
在本节中,我们将向函数添加参数。使用函数的参数,我们可以通过参数初始化对象的键。当我们使用“new”关键字创建新对象时,我们将向对象的实例传递实参。
与创建普通对象相比,将函数用作对象具有更多优势。当我们将参数化函数用作对象时,我们可以通过将键的值作为实参传递来创建具有不同值的新对象。如果我们使用普通对象,则需要为每个键重新初始化值。
语法
用户可以按照以下语法在用作对象的函数内部声明方法。
function funcObject(param1, param2) {
this.key1 = param1;
this.key2 = param2;
this.method = function () {
// code for current method
}
}
// object of the function with arguments
let newObject = new funcObject( "hello", "world" );
newObject.method(); // invoking the method of the object示例 2
在下面的示例中,我们创建了带参数的函数。此外,该函数包含已分配给变量的方法。我们创建了匿名方法以将其分配给变量。之后,我们通过传递实参,使用函数创建了对象的实例。
<html>
<body>
<h2> Use Javascript function as an object. </h2>
<p> Create method inside the function, initialize value of the function variable, and use it as an object. </p>
<div id="value"> </div>
<script>
function funcObject( param1, param2 ) {
this.key1 = param1;
this.key2 = param2;
this.method = function () {
return " The sum of 10 + 30 is " + ( 10 + 30 );
}
}
// Creating the instance of the function to use it as an object.
let newObject = new funcObject("hello", "world");
let values = document.getElementById("value");
values.innerHTML = " key1: " + newObject.key1 + " <br/>";
values.innerHTML += " key2: " + newObject.key2 + " <br/>";
values.innerHTML += " return value from method: " + newObject.method() + " <br/>";
</script>
</body>
</html>结论
我们学习了如何将函数用作对象。在这里,this 关键字在创建当前函数的变量中起着重要作用。当使用用户定义的对象时,最好使用多个值来管理对象。此外,我们可以传递值来初始化键,并只需一行代码即可创建新对象。
数据结构
网络
关系数据库管理系统
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP