javaScript-函数对象

最新推荐文章于 2023-02-23 15:37:24 发布

guardwhy

最新推荐文章于 2023-02-23 15:37:24 发布

阅读量1.3k

点赞数 6

分类专栏： # JavaScript

本文链接：https://blog.csdn.net/hxy1625309592/article/details/116033713

版权

1.1 原型对象

prototype为原型对象。每一个构造函数都有一个prototype 属性，指向另一个对象。
prototype就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。
原型对象的作用是共享方法。

代码示例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>prototype特点</title>
  <script type="text/javascript">
	function Person(myName, myAge){
    
	  this.name = myName;
	  this.age = myAge;
	  this.currentType = "构造函数中的type";
	  this.say = function (){
    
	    console.log("构造函数的的say构造方法");
	  }
	}
	Person.prototype = {
    
	  currentType:"hello javaScript!!!",
	  say: function (){
    
	    console.log("hello world");
	  }
	}
	// 创建对象
	let obj1 = new Person("curry", 10);
	obj1.say();
	console.log(obj1.currentType);
	console.log("++++++++++++++++");
    let obj2 = new Person("james", 35);
    obj2.say();
    console.log(obj2.currentType);
  </script>
</head>
<body>
	<!--
	原型 prototype:
        1.每当创建的每一个函数,解析器都会向函数中添加一个属性prototype。
        这个属性对应着一个对象，这个对象就是我们所谓的原型对象。函数作为普通函数调用prototype没有任何作用。

        2.当函数以构造函数的形式调用时，它所创建的对象中都会有一个隐含的属性，指向该构造函数的原型对象。
          可以通过__proto__来访问该属性。

        3.原型对象就相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象，可以将对象中共有的内容，统一设置到原型对象中。

        4.当访问对象的一个属性或方法时，它会先在对象自身中寻找，如果有则直接使用，如果没有则会去原型对象中寻找，如果找到则直接使用。

        5.以后创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中。
          这样不用分别为每一个对象添加，也不会影响到全局作用域，就可以使每个对象都具有这些属性和方法了。
	-->
</body>
</html>

执行结果

1.2 对象原型

基本特点

每个对象都会有一个属性__ proto __ 指向构造函数的prototype原型对象。
对象可以使用构造函数prototype原型对象的属性和方法，就是因为对象有 __ proto __ 原型的存在。
__ proto __ 对象原型和原型对象 prototype 是等价的。
__ proto __对象原型的意义为对象的查找机制提供一个方向，实际开发中，不可以使用这个属性，它只是内部指向原型对象 prototype。

1.3 Constructor属性

对象原型(_ _ proto _ _)和构造函数原型对象(prototype)里面都有一个属性constructor属性，constructor称为构造函数，因为它指回构造函数本身。

注意事项

constructor 主要用于记录该对象引用于哪个构造函数，它可以让原型对象重新指向原来的构造函数。
一般情况下，对象的方法都在构造函数的原型对象中设置。如果有多个对象的方法，可以给原型对象采取对象形式赋值。但是这样就会覆盖构造函数原型对象原来的内容，这样修改后的原型对象 constructor 就不再指向当前构造函数了。
此时，可以在修改后的原型对象中，添加一个 constructor 指向原来的构造函数。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>对象三角关系</title>
  <script type="text/javascript">
	/*
	 	1.每个"构造函数"中都有一个默认的属性, 叫做prototype
          prototype属性保存着一个对象, 这个对象我们称之为"原型对象"
        2.每个"原型对象"中都有一个默认的属性, 叫做constructor
          constructor指向当前原型对象对应的那个"构造函数"
        3.通过构造函数创建出来的对象我们称之为"实例对象"
          每个"实例对象"中都有一个默认的属性, 叫做__proto__
          __proto__指向创建它的那个构造函数的"原型对象"
	 */
	
	// 1.创建Person构造函数
	function Person(myName, myAge){
    
	  this.name = myName;
	  this.age = myAge;
	}

	// 示例化对象
	let obj = new Person("guardwhy", 26);

	// 输出结果
	console.log(Person.prototype);
	console.log(Person.prototype.constructor);
	console.log(obj.__proto__);
  </script>
</head>
<body>

</body>
</html>

执行结果

1.4 Function函数

基本特点

JavaScript中函数是引用类型(对象类型),既然是对象，所以也是通过构造函数创建出来的。所有函数都是通过Function构造函数创建出来的对象。

只要是函数就有prototype属性，Function函数的prototype属性指向Function原型对象。

JavaScript中只要原型对象就有constructor属性，Function原型对象的constructor指向它对应的构造函数。

代码示例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Function函数</title>
  <script type="text/javascript">
    /*
	 Person构造函数是Function构造函数的实例对象, 所以也有__proto__属性
	 Person构造函数的__proto__属性指向"Function原型对象"
	*/

	// 1.构造函数
	function Person(myName, myAge){
    
	  this.name = myName;
	  this.age = myAge;
	}
    // 2.实例化对象
    let obj = new Person("guardwhy", 26);
	// 3.输出结果
	console.log(Function);
	console.log(Function.prototype);
	console.log(Function.prototype.constructor);
	console.log("+++++++++++++");

	console.log(Function == Function.prototype.constructor); // true
    console.log("=============");
	console.log(Person.__proto__);
	console.log(Person.__proto__ == Function.prototype);	// true
  </script>
</head>
<body>

</body>
</html>

Function关系图

1.5 Object函数

JavaScript中还有一个系统提供的构造函数叫做Object，只要是函数都是Function构造函数的实例对象。

只要是对象就有__ proto __ 属性, 所以Object构造函数也有__ proto __ 属性。Object构造函数的 __ proto__ 属性指向创建它那个构造函数的原型对象。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Object函数</title>
  <script type="text/javascript">
    /*
	1.只要是构造函数都有一个默认的属性, 叫做prototype，prototype属性保存着一个对象, 这个对象我们称之为原型对象。
	2.只要是原型对象都有一个默认的属性, 叫做constructor，constructor指向当前原型对象对应的那个构造函数。
	*/

	// 1.创建Person构造函数
	function Person(myName, myAge){
    
	  this.name = myName;
	  this.age = myAge;
	}
    // 实例化对象
	let obj1 = new Person("guardwhy", 26);
	// 输出结果
	console.log(Function.__proto__);
	console.log(Function.__proto__ === Function.prototype);	// true
	console.log("++++++++++++++++++");

	console.log(Object);
	console.log(Object.__proto__);
	console.log(Object.__proto__ === Function.prototype); // true
	console.log("============");

	console.log(Object.prototype);
	console.log(Object.prototype.constructor);
	console.log("-----------------");

	console.log(Object.prototype.constructor == Object);	// true
	console.log(Object.prototype.__proto__); 	// null
  </script>
</head>
<body>

</body>
</html>

执行结果

Object函数关系图

1.6 函数对象关系

函数对象特点

Function函数是所有函数的祖先函数。所有构造函数都有一个prototype属性。
所有原型函数对象都有一个constructor属性，所有函数都是对象,所有对象都有一个__proto__属性。

代码示例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>函数对象关系</title>
  <script type="text/javascript">
    /*
	  1.所有的构造函数都有一个prototype属性, 所有prototype属性都指向自己的原型对象
	  2,所有的原型对象都有一个constructor属性, 所有constructor属性都指向自己的构造函数
	  3.所有函数都是Function构造函数的实例对象
	  4.所有函数都是对象, 包括Function构造函数
	  5.所有对象都有__proto__属性
	  6.普通对象的__proto__属性指向创建它的那个构造函数对应的"原型对象"
	  7.所有对象的__proto__属性最终都会指向"Object原型对象"
	  8."Object原型对象"的__proto__属性指向NULL
	*/

	// 构造函数Person
    function Person(myName, myAge){
    
      this.name = myName;
      this.age = myAge;
    }

    // 实例化对象
    let obj1 = new Person("guardwhy", 21);

    console.log(Function.prototype.__proto__);
    console.

最低0.47元/天解锁文章

guardwhy

关注

6
点赞
踩
22

收藏

觉得还不错? 一键收藏
4
评论
javaScript-函数对象

1.1 原型对象prototype为原型对象。每一个构造函数都有一个prototype 属性，指向另一个对象。prototype就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。原型对象的作用是共享方法。代码示例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>prototype特点</title> <s
复制链接

扫一扫