基于JavaScript自定义构造函数的详解说明

Javascript并不像Java、C#等语言那样支持真正的类。但是在js中可以定义伪类。做到这一点的工具就是构造函数和原型对象。首先介绍js中的构造函数。

Javascript中创建对象的语法是在new运算符的后面跟着一个函数的调用。如


代码如下:

var obj = new Object();
 var date = new Date();

运算符new首先创建一个新的没有任何属性的对象,然后调用该函数,把新的对象作为this关键字的值传递。
var date = new Date()的伪代码的实现就是

var obj = {};

var date = Date.call(obj);

构造函数的作用就是初始化一个新创建的对象,并在使用对象前设置对象的属性。如果定义自己的构造函数,只需要编写一个为this添加属性的函数就可以了。下面的代码定义了一个构造函数:


代码如下:

function Rectangle(w, h)
 {
     this.width = w;
     this.height = h;
 }

然后,可以使用new运算符调用这个函数来创建对象的实例

var rect = new Rectange(4,8);

构造函数的返回值

Javascript中的构造函数通常没有返回值。但是,函数是允许有返回值的。如果一个构造函数有一个返回值,则返回的对象成为new表达式的值。在此情况下,作为this的对象将会被抛弃。

(0)

相关推荐

  • javascript设计模式之对象工厂函数与构造函数详解

    下面通过文字详解加代码分析的方式给大家分享下javascript设计模式之对象工厂函数与构造函数的相关知识. 概述使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法.然而,除了这两种常用的对象创建方式,JavaScript还提供了其他方法创建对象.1).使用工厂函数创建对象我们可以编写一个函数,此函数的功能就是创建对象,可将其. 概述 使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法. 然而,除了这两种常用的对象创建方式,JavaScript还提

  • JavaScript利用构造函数和原型的方式模拟C#类的功能

    复制代码 代码如下:      //构造函数        function person(name, age) {            this.name = name;            this.age = age;        }        //定义person原型,原型里的属性可以被自定义对象引用        person.prototype = {            getName: function () {                return this.

  • JavaScript继承基础讲解(原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承)

    说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象JS基础讲解,工厂模式.构造函数模式.原型模式.混合模式.动态原型模式>,接下来讲一般通过那些方法完成JavaScript的继承. 原型链 JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即"子类型.prototype = new 父类型();&qu

  • 浅谈javascript构造函数与实例化对象

    前言--讲在前面 我想有很多以前很少接触后台编程语言的初学者朋友跟我一样,对javascript里面一系列的"名词"搞的一头雾水.好像大概知道讲的是什么,但其实理解的还是不清楚:我想,学习任何一种知识,首当其冲应该把最基本的名词解释搞清楚(知道它讲的到底是什么,有助于我们更好的理解它.)即知其然知其所以然,这样对以后的进阶学习是很有帮助的.下面的简单讲一下我自己对这样一些看似不重要但又不得不清楚的知识点的理解.(若有出入,欢迎指正) 1.什么是构造函数 构造函数 ,是一种特殊的方法.主

  • 深入理解javascript构造函数和原型对象

    常用的几种对象创建模式 使用new关键字创建 最基础的对象创建方式,无非就是和其他多数语言一样说的一样:没对象,你new一个呀! var gf = new Object(); gf.name = "tangwei"; gf.bar = "c++"; gf.sayWhat = function() { console.log(this.name + "said:love you forever"); } 使用字面量创建 这样似乎妥妥的了,但是宅寂的

  • 基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解

    继承的方式 ECMAScript 实现继承的方式不止一种.这是因为 JavaScript 中的继承机制并不是明确规定的,而是通过模仿实现的.这意味着所有的继承细节并非完全由解释程序处理.作为开发者,你有权决定最适用的继承方式.最原始的继承实现方式就是对象冒充,下面着重介绍该方法. 对象冒充 对象冒充实现继承的核心其实依赖于在函数环境中使用 this 关键字.其原理如下:构造函数使用 this 关键字给所有属性和方法赋值(即采用类声明的构造函数方式).因为构造函数只是一个函数,所以可使 Class

  • 基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解

    构造函数.原型实现继承的缺陷 首先来分析构造函数和原型链两种实现继承方式的缺陷: 构造函数(对象冒充)的主要问题是必须使用构造函数方式,且无法继承通过原型定义的方法,这不是最好的选择.不过如果使用原型链,就无法使用带参数的构造函数了.开发者如何选择呢?答案很简单,两者都用. 构造函数+原型混合方式 这种继承方式使用构造函数定义类,并非使用任何原型.创建类的最好方式是用构造函数定义属性,用原型定义方法.这种方式同样适用于继承机制,用对象冒充继承构造函数的属性,用原型链继承 prototype 对象

  • 基于JavaScript自定义构造函数的详解说明

    Javascript并不像Java.C#等语言那样支持真正的类.但是在js中可以定义伪类.做到这一点的工具就是构造函数和原型对象.首先介绍js中的构造函数. Javascript中创建对象的语法是在new运算符的后面跟着一个函数的调用.如 复制代码 代码如下: var obj = new Object(); var date = new Date(); 运算符new首先创建一个新的没有任何属性的对象,然后调用该函数,把新的对象作为this关键字的值传递.var date = new Date()

  • 基于JavaScript表单脚本(详解)

    什么是表单? 一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域:包含了文本框.密码框.隐藏域.多行文本框.复选框.单选框.下拉选择框和文件上传框等. 表单按钮:包括提交按钮.复位按钮和一般按钮:用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作. JavaScript与表单间的关系:JS最初的应用就是用于分担服务器处理表单的责任,打破依赖服务器的局面,尽管目前web和jav

  • JavaScript自定义函数用法详解

    JavaScript中的函数分为两种:系统函数和自定义函数,这里主要讲解自定义函数. 自定义函数 1.语法: 注意: 传入的参数是可选的. 例如: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi

  • 基于JavaScript 类的使用详解

    以下为构造函数方法创建类: 复制代码 代码如下: function className (prop_1, prop_2, prop_3) {  this.prop1 = prop_1;  this.prop2 = prop_2;  this.prop3 = prop_3;} 有了上面的类,我们就可以为类创建实例: 复制代码 代码如下: var obj_1 = new className(v1, v2, v3)var obj_2 = new className(v1, v2, v3) 我们也可以给

  • 基于Spring-AOP实现自定义分片工具详解

    目录 1.背景 2.Spring-AOP 3.功能实现 3.1 MethodPartAndRetryer 3.2 RetryUtil 3.3 RetryAspectAop 4.功能使用 4.1 配置文件 4.2 代码示例 5.小结 1.背景 随着数据量的增长,发现系统在与其他系统交互时,批量接口会出现超时现象,发现原批量接口在实现时,没有做分片处理,当数据过大时或超过其他系统阈值时,就会出现错误.由于与其他系统交互比较多,一个一个接口去做分片优化,改动量较大,所以考虑通过AOP解决此问题. 2.

  • 基于Laravel-admin 后台的自定义页面用法详解

    Laravel-admin 这个后台很好用,几乎省去了html和js的困扰,让后台CURD变得优雅简洁. 这是一个自定义面的Demo 路由定义: $router->get('mails/send', 'MailController@send'); $router->post('mails/send', 'MailController@send'); 控制中写法: public function send(Content $content) { //添加请求 if (request()->

  • 基于JWT.NET的使用(详解)

    JWT是什么 JWT全称是Json Web Token,是一种用于双方之间传递安全信息的简洁的.URL安全的表述性声明规范.JWT作为一个开放的标准( RFC 7519 ),定义了一种简洁的,自包含的方法用于通信双方之间以Json对象的形式安全的传递信息.因为数字签名的存在,这些信息是可信的,JWT可以使用HMAC算法或者是RSA的公私秘钥对进行签名. JWT的结构 JWT一般由三段构成,用.号分隔开,第一段是header,第二段是payload,第三段是signature,例如: eyJ0eX

  • 基于Vue单文件组件详解

    本文将详细介绍Vue单文件组件 概述 在很多 Vue 项目中,使用 Vue.component 来定义全局组件,紧接着用 new Vue({ el: '#container '}) 在每个页面内指定一个容器元素. 这种方式在很多中小规模的项目中运作的很好,在这些项目里 JavaScript 只被用来加强特定的视图.但当在更复杂的项目中,或者前端完全由 JavaScript 驱动的时候,下面这些缺点将变得非常明显: 1.全局定义 (Global definitions) 强制要求每个 compon

  • 基于Python闭包及其作用域详解

    关于Python作用域的知识在python作用域有相应的笔记,这个笔记是关于Python闭包及其作用域的详细的笔记 如果在一个内部函数里,对一个外部作用域(但不是全局作用域)的变量进行引用,那么内部函数就被称为闭包(closure),而这个被内部函数引用的变量则被成为自由变量 闭包和函数调用没多少相关,而是关于使用定义在其他作用域的变量 命名空间和作用域 我们把命名空间看做一个大型的字典类型(Dict),里面包含了所有变量的名字和值的映射关系.在 Python 中,作用域实际上可以看做是"在当前

  • Android启动内置APK和动态发送接收自定义广播实例详解

    Android启动内置APK和动态发送接收自定义广播实例详解 工作中遇到这样一个需求,需要为按键添加一个亲情号,提供一个接口启动内置的APK,思考再三决定更改Framework,利用广播机制去实现. 一.代码动态自主启动内置APK 我们都知道Android系统为我们提供了很多服务管理类,PackageManager主要是管理应用程序包,通过它就可以获取应用程序信息并构建Intent,启动对应的应用.除此之外Android还未我们提供了一些对应的类来管理相关的xml文件,比如说可以通过Packag

随机推荐