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系统编译的,确保在这样的...
通过使用 `--jsInterop` 标志,开发者可以创建 Java 类并在 JavaScript 中调用,也可以在 Java 中调用 JavaScript 函数。 4. **源码分析** 压缩包中的源码可能包含了以下几个部分: - **Java 源码**:展示了如何...
标题 "使用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构建现代...
在Android应用开发中,与JavaScript的交互是一个常见的需求,特别是在构建混合式应用或者利用Web技术增强原生功能时。这份"Android应用源码之Android调用JavaScript"的资源提供了这样的一个示例,非常适合毕业设计...
困惑该项目是在学习前端javascript框架时创建的:香港科技大学的Coursera中的Angular课程。 本课程由Joesh K Muppala 。 该项目是使用版本6.2.1生成的。开发服务器为开发服务器运行ng serve 。 导航到...
使用类构建 javascript 应用程序的教程 先决条件 吉特 了解如何设置 git 的好地方是。 Git(下载、文档)。 提交/教程大纲 您可以使用 git checkout step-x 查看本教程的任何一点 要查看任何两节课之间的更改,请...
在这个“纯 html + css + javascript 小清新静态web网站”项目中,我们看到了一个完全基于前端技术构建的精美网页设计。HTML(HyperText Markup Language)是网页内容的基础,CSS(Cascading Style Sheets)用于控制...
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 ...
这个"javascript实例应用---综合类.rar"压缩包很可能包含了多种JavaScript的实际应用案例,旨在帮助学习者理解并掌握JavaScript在不同场景下的使用技巧。 1. **基础语法**:JavaScript的基础包括变量、数据类型(如...
这是我从头开始构建的通用JavaScript开发环境。 这与任何特定的JS框架无关。 开始使用 安装。 需要运行多个版本的Node? 使用或 克隆此存储库。 git clone ...
此插件可让您使用对输入的javascript文件进行。 入门 开始使用您最喜欢的软件包管理器。 用纱安装 纱线添加-D包裹插件模糊处理 使用npm安装 npm install -D parcel-plugin-混淆 在生产模式下运行宗地以混淆代码 ...
### Object-Oriented JavaScript #### 知识点一:面向对象编程在...通过深入理解上述知识点,开发者能够更好地掌握如何使用JavaScript构建高质量的应用程序和库,同时也能提升个人技能,适应快速发展的前端技术栈。
Syncfusion JavaScript UI控件库 您将需要的唯一JavaScript UI库。 使用Essential JS 2创建的屏幕 目录 框架要点 轻巧且用户友好 整个Essential JS 2框架是从头开始构建的,是轻量级和模块化的。 通过仅包含应用程序...
JavaScript-Excel [WIP] 内置的轻量级Excel文件构建API :red_heart: ,由JavaScript驱动 安装 使用 : npm install javascript-excel --save
标题中的"class-html-javascript-calc"项目显然是一个教学资源,旨在教授如何使用HTML、CSS和JavaScript构建一个基本的计算器。这个项目创建于2020年7月3日,是学习Web开发基础知识的一个实例,特别关注用户交互和...
此SDK由项目自动生成: API版本:测试版套件版本:Beta 构建程序包:io.swagger.codegen.languages.JavascriptClientCodegen有关更多信息,请访问安装对于npm 要将库发布为 ,请按照的步骤进行操作。 然后通过以下...
【JavaScript实战 - 构建3个有用的代码组件】 在IT领域,JavaScript是一种广泛使用的编程语言,尤其在网络开发中占据核心地位。它允许开发者创建交互式的网页,为用户提供丰富的动态体验。本课程“JavaScript实战 -...