javascript里构建类主要有4种方式
1.构造方式定义类
2.原型方式定义类
3.构造和原型结合方式创建类
4.动态的原型方式
各有优缺点,具体如下
1.
构造方式定义类,优点:多个实例对象不共享类的属性值,缺点:每个实例对象都会产生出一个函数say
//构造方式定义类,优点:多个实例对象不共享类的属性值,缺点:每个实例对象都会产生出一个函数say
function User(){
this.username = "zhangsan";//this.不能丢
this.say = function(){//this.不能丢
alert("username:" + this.username );//this.不能丢
}
//下面注释的这种写法不对
// function say(){
// alert("username:" + this.username );
// }
}
var user = new User();
user.username = "lisi";
user.say();//username:lisi
var user1 = new User();
user1.say();//username:zhangsan,不受user对象的影响
//多个实例对象不共享类的属性值:
//多个实例对象不共享类的属性值,如下:
function User(){
this.username = new Array();//this.不能丢
this.say = function(){//this.不能丢
alert("username:" + this.username );//this.不能丢
}
}
var user = new User();
user.username.push("zhangsan");
user.say();//username:zhangsan
var user1 = new User();
user1.say();//user1的username为空,不为zhangsan,因为user1的属性值不受user影响
2.
原型方式定义类,缺点:类的属性值如果是引用类型的(非Number和String类型),则多个实例对象共享
//原型方式定义类,缺点:类的属性值如果是引用类型的(非Number和String类型),则多个实例对象共享
function User(){
}
User.prototype.username = "zhangsan";
User.prototype.say = function(){
alert("username: " + this.username );
}
var user = new User();
user.username = "lisi";
user.say();//username:lisi
var user1 = new User();
user1.say();//username:zhangsan
类的属性值如果是引用类型的(非Number和String类型),则多个实例对象共享:
//类的属性值如果是引用类型的(非Number和String类型),则多个实例对象共享,如下
function User(){
}
User.prototype.username = new Array();
User.prototype.say = function(){
alert("username: " + this.username );
}
var user = new User();
user.username.push("zhangsan") ;
user.say();//username:zhangsan
var user1 = new User();
user1.say();//username:zhangsan,因为user1属性也会受到user的影响,user1和user指向同一引用,即共享同一属性
3.
构造和原型结合方式创建类:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享;缺点:属性和方法分开定义不是太好。
//构造和原型结合方式创建类:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享;缺点:属性和方法分开定义不是太好。
function User(){
this.username = "zhangsan";
}
User.prototype.say = function(){
alert("username: " + this.username );
}
var user = new User();
alert(user.username);
4.
动态的原型方式:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享,同时属性和方法不是分开定义的
////动态的原型方式:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享,同时属性和方法不是分开定义的
function User(){
this.username = "zhangsan";
if(typeof User.flag == "undefined"){
alert("execute...");
User.prototype.say = function(){
alert("username: " + this.username );
}
User.flag = true;
}
}
var user1 = new User();//execute...
var user2 = new User();//不会打印出execute...,则说明方法只创建了一次,即方法只会产生一个
user1.say();//username
总结:
构造方式定义类:缺点:类里的方法,每个实例对象都会产生一个,导致产生大量方法;优点:所有实例对象都单独拥有一份类里的属性,即属性不共享
原型方法定义类:缺点:所有实例对象都共同拥有一份类里的属性,即属性共享。优点:类的方法只会产生一个,不会产生大量方法
构造和原型结合方式创建类:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享;缺点:属性和方法分开定义不是太好。
动态的原型方式:优点:类的方法只会产生一个,不会产生大量方法,同时属性还不共享,同时属性和方法不是分开定义的
分享到:
相关推荐
【描述】提到"Eclipse JavaScript工具",意味着这个版本的Eclipse集成了各种JavaScript开发所需的特性,如代码编辑、调试、构建和测试等功能。"Windows 64位"表明该软件是为64位的Windows系统编译的,确保在这样的...
JavaScript,作为一种轻量级的解释型编程语言,是构建动态网页、交互式应用及服务器端开发的核心工具。 课程内容覆盖了JavaScript的基础语法,包括变量、数据类型、操作符、流程控制、函数、对象和数组等核心概念。...
标题 "使用JavaScript进行React式编程" 指的是学习如何运用JavaScript这门广泛使用的编程语言来构建基于React的用户界面。React是由Facebook开发的一个用于构建用户界面的JavaScript库,尤其适用于构建可重用且组件...
demo-aspnet-javascript-services-webpack-hmr.zip,带Webpack HMR和SPAFallbackRouteAngular的Angular、ASP.NET核心JavaScript服务、ASP.NET核心JavaScript服务,asp.net是一个开源的web框架,用于使用.net构建现代...
困惑该项目是在学习前端javascript框架时创建的:香港科技大学的Coursera中的Angular课程。 本课程由Joesh K Muppala 。 该项目是使用版本6.2.1生成的。开发服务器为开发服务器运行ng serve 。 导航到...
Atom-atom-language-javascript-jxa.zip,@atom中的javascript for automation(jxa)语言支持。atom中的javascript for automation(“jxa”)语言支持,atom是一个用web技术构建的开源文本编辑器。
使用类构建 javascript 应用程序的教程 先决条件 吉特 了解如何设置 git 的好地方是。 Git(下载、文档)。 提交/教程大纲 您可以使用 git checkout step-x 查看本教程的任何一点 要查看任何两节课之间的更改,请...
Atom-language-javascript-plus.zip,JavaScriptPlus | Syntax Highlighting For Template Strings In Atomjavascript增强版,atom是一个用web技术构建的开源文本编辑器。
在这个“纯 html + css + javascript 小清新静态web网站”项目中,我们看到了一个完全基于前端技术构建的精美网页设计。HTML(HyperText Markup Language)是网页内容的基础,CSS(Cascading Style Sheets)用于控制...
JavaScript构建系统是软件开发中的重要组成部分,特别是在JavaScript领域,它能帮助开发者自动化代码编译、压缩、测试等过程,提高开发效率。`javascript-build`是一个针对JavaScript包开发的构建工具,它借鉴了GNU ...
在这个名为“smt-antlr4-javascript-parser”的项目中,主要目标是利用ANTLR4工具为JavaScript生成解析类。 ANTLR4 的核心功能是生成解析器和词法分析器。解析器负责理解语法规则并构建抽象语法树(AST),而词法...
这个"javascript实例应用---综合类.rar"压缩包很可能包含了多种JavaScript的实际应用案例,旨在帮助学习者理解并掌握JavaScript在不同场景下的使用技巧。 1. **基础语法**:JavaScript的基础包括变量、数据类型(如...
此插件可让您使用对输入的javascript文件进行。 入门 开始使用您最喜欢的软件包管理器。 用纱安装 纱线添加-D包裹插件模糊处理 使用npm安装 npm install -D parcel-plugin-混淆 在生产模式下运行宗地以混淆代码 ...
### Object-Oriented JavaScript #### 知识点一:面向对象编程在...通过深入理解上述知识点,开发者能够更好地掌握如何使用JavaScript构建高质量的应用程序和库,同时也能提升个人技能,适应快速发展的前端技术栈。
该项目为基于Mirai和Spring框架的JavaScript-Kotlin混合编程设计源码,共计包含47个文件,涵盖34个Kotlin文件、6个Kotlin脚本文件、2个属性文件、1个Git忽略文件、1个Markdown文件、1个JAR包文件、1个Gradle构建文件...
Syncfusion JavaScript UI控件库 您将需要的唯一JavaScript UI库。 使用Essential JS 2创建的屏幕 目录 框架要点 轻巧且用户友好 整个Essential JS 2框架是从头开始构建的,是轻量级和模块化的。 通过仅包含应用程序...
JavaScript-Excel [WIP] 内置的轻量级Excel文件构建API :red_heart: ,由JavaScript驱动 安装 使用 : npm install javascript-excel --save
此SDK由项目自动生成: API版本:测试版套件版本:Beta 构建程序包:io.swagger.codegen.languages.JavascriptClientCodegen有关更多信息,请访问安装对于npm 要将库发布为 ,请按照的步骤进行操作。 然后通过以下...
它还将涵盖各种编程构建块,如变量、函数、数组、条件、对象等等。 主题(用空格分隔) 添加主题以对存储库进行分类并使其更易于发现: javascript 编程语言 javascript语言基础知识 javascript-基本编程 javascript...
JavaScript构建管道是现代Web开发中的核心概念,它用于自动化项目的构建过程,包括源代码的预处理、打包、优化和部署。这个存储库“javascript-buildpipeline”聚焦于如何构建高效的JavaScript项目构建流程,它可能...