VSCode自定义代码片段9——JS中的面向对象编程

原创已于 2022-04-13 11:53:43 修改 · 914 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#自定义代码片段 #vscode #js的面向对象编程

于 2022-04-12 06:43:24 首次发布

VSCode自定义代码片段同时被 2 个专栏收录

15 篇文章

订阅专栏

7 篇文章

订阅专栏

本文介绍了JavaScript中的面向对象编程概念，包括构造函数、实例创建和原型链。通过示例展示了如何使用构造函数创建类，并利用原型实现共享属性和方法，强调了实例之间的独立性和原型链的作用。同时，提到了VSCode中自定义代码片段的方法，帮助开发者提高效率。

JavaScript的面向对象编程

{
	// JS'OOP
	// 9  如何自定义用户代码片段：VSCode =》左下角设置 =》用户代码片段 =》新建全局代码片段文件... =》自定义片段名称 =》编辑用户片段 =》ctrl+S 保存
	// JS中的面向对象编程
	"Print to console": {
		"prefix": "JS'OOP",
		"body": [
			"//JavaScript中面向对象编程：主要依赖构造函数刻出类，new关键字创建实例，\".\"操作符调用属性及方法",
			"function Person (name, age) {//构造函数(类)",
			"    this.name = name",
			"    this.age = age",
			"    this.sayName = function () {",
			"      console.log(this.name)",
			"    }",
			"  }",
			"  //注意：类名要求大字首字母，构造函数最后一句是隐藏了的\"return this;\",各个实例相似却是独立内存",
			"  var p1 = new Person(\"张三\", 18) //创建实例",
			"  p1.sayName() // => 张三",
			"  ",
			"  var p2 = new Person(\"李四\", 23)",
			"  p2.sayName() // => 李四",
			"//更少内存的面向对象编程方案（私有属性及方法写构造方法里，共享属性及方法写原型里）：用Person.prototype对象存放实例们共享的属性及方法，每个构造函数都有prototype对象，且互相关联属性及方法的地址(Person.prototype , Person.prototype.constructor)",
			"//实例调用共享属性及方法：p1.__proto__.共享属性及方法(`__proto__` 是非标准属性,是一个指向构造函数原型的指针)",
			"//实例p1.sayName()的运行会先去实例本身找sayName方法，没找到则自动通过__proto__指针去原型里找sayName()方法，其实原型也有__proto__也会继续向上查找，直到发现Object.prototype.__proto__=null",
			"",
			"function Person (name, age) {//构造函数内放：私有属性及方法",
			"    this.name = name",
			"    this.age = age",
			"  }",
			"   ",
			"Person.prototype = {原型内放：共享属性及方法",
			"    constructor: Person, // => 手动将 constructor 指向正确的构造函数",
			"    type: \"学生\",",
			"    sayHello: function () {",
			"    console.log(\"我叫\" + this.name + \"，我今年\" + this.age + \"岁了\")",
			"  }",
		],
		"description": "JS中的面向对象编程"
	}
}