1.给10个div添加点击事件

<body>

    <div class="sd">sdss</div>

    <div class="sd">hsdjs</div>

    <div class="sd">sdss</div>

    <div class="sd">hsdjs</div>

    <div class="sd">sdss</div>

    <div class="sd">hsdjs</div>

    <div class="sd">sdss</div>

    <div class="sd">hsdjs</div>

    <div class="sd">sdss</div>

    <div class="sd">hsdjs</div>

</body>

　一般写法

var divs = document.getElementsByClassName('sd');

for(var i = 0; i< divs.length; i++){

    divs[i].onclick = function(){

        /*点击事件*/

    }

}

每一个onclick 事件都是一个新的function 就会在内存里面定义10次。

用混合构造改写。让10个function只占用一遍内存

function SetDom(dom){

    this.dom = dom;

}

SetDom.prototype.setClick = function(){

    this.dom.onclick = function(){

        /*点击事件*/

    }

}

for(var i = 0; i< divs.length; i++){

    var div = new SetDom(divs[i]);

    div.setClick();

}

/*注意点*/

1.必须把变量的定义写进构造里面，避免定义在原型中，引用类型的数据覆盖。

2.事件定义在构造的原型对象上面，可以让事件在内存只定义一次。

js 混合构造原型 运用的更多相关文章

  1. js的原型

    在讲js的原型之前,必须先了解下Object和Function. Object和Function都作为JS的自带函数,Object继承自己,Funtion继承自己,Object和Function互相是 ...

  2. 前端基本知识（二）：JS的原型链的理解

    之前一直对于前端的基本知识不是了解很详细,基本功不扎实,但是前端开发中的基本知识才是以后职业发展的根基,虽然自己总是以一种实践是检验真理的唯一标准,写代码实践项目才是唯一,但是经常遇到知道怎么去解决这 ...

  3. js javascript 原型链详解

    看了许多大神的博文,才少许明白了js 中原型链的概念,下面给大家浅谈一下,顺便也是为了巩固自己 首先看原型链之前先来了解一下new关键字的作用,在许多高级语言中,new是必不可少的关键字,其作用是为了 ...

  4. 攻略前端面试官（三）：JS的原型和原型链

    本文在个人主页同步更新~ 背就完事了 介绍:一些知识点相关的面试题和答案 使用姿势:看答案前先尝试回答,看完后把答案收起来检验成果~ 面试官:什么是构造函数 答:构造函数的本质是一个普通函数,他的特点 ...

  5. 怎么理解js的原型链继承？

    前言 了解java等面向对象语言的童鞋应该知道.面向对象的三大特性就是:封装,继承,多态. 今天,我们就来聊一聊继承.但是,注意,我们现在说的是js的继承. 在js的es6语法出来之前,我们想实现js ...

  6. 我去！JS的原型是咋回事？

    我去!JS的原型是咋回事? 最近写公司的项目,写着写着发现自己的原型的理解还是不够透彻,又去网上查了一番资料,顺便总结一下,在顺便给到的朋友能提供一点帮助.如有遗漏,欢迎交流. 原型是啥?为什么要用原 ...

  7. 关于JS对象原型prototype与继承，ES6的class和extends · kesheng's personal blog

    传统方式:通过function关键字来定义一个对象类型 1234567891011 function People(name) { this.name = name}People.prototype. ...

  8. 基础1：JS的原型和原型链究竟

    JS的原型和原型链究竟是什么? 1. 从JS创建一个对象开始说起: 1.1 工厂模式创建对象 (缺点是无法知道创建出来的对象是一个什么类型的对象) function createPerson(name ...

  9. 自己对js对原型链的理解

    js对象分为2种 函数对象和普通对象 函数对象 比如 function Show(){}var x=function Show2(){}var b=new Function("show3&q ...

随机推荐

  1. github默认端口22被占用，ssh: connect to host github.com port 22: Connection timed out

    出现github 连接错误: ssh:connect to host github.com port 22:Connection timed out 刚开始以为是网络问题,github不能连接上,但是 ...

  2. JDBC--获取数据库连接

    1.JDBC(Java Database Connectivity)是一个独立于特定数据库管理系统.统一的sQL数据库存取和操作的公共接口. 2.Java中的几种数据库存取技术: --1)JDBC直接 ...

  3. SSM-文件上传

    因为开发环境和线上环境系统不一样,所以需要区别环境 config.java 可以判断系统进行自动化的区别,我是手动去切换注释的 public class config { //public stati ...

  4. Core data 如何查看ObjectId

    ObjectId是Core Data 为每一个数据对象提供的唯一ID标识,获取ObjectID.并打印的方法如下: 步骤: 1. 获取ManagedObject 2. ManagedObject -& ...

  5. mysql里的序列应用详解

    相关知识库: MySQL知识库 相关文章: ibatis中主键的返回 oracle 实现自增auto_increament 用oracle的trigger生成主键的时候和hibernate冲突的讨论 ...

  6. C# 篇基础知识4——.NET的基础概念

    C#语言是与微软的.NET框架紧密地联系在一起的,而.NET框架是微软.NET战略的核心,为了更好的理解C#语言,我们必须了解一些.NET框架的基本知识..NET框架是为开发应用程序推出的一个编程平台 ...

  7. C# 创建Windows Service（Windows服务）程序

    本文介绍了如何用C#创建.安装.启动.监控.卸载简单的Windows Service 的内容步骤和注意事项. 一.创建一个Windows Service 1)创建Windows Service项目 2 ...

  8. Beta阶段计划

    Beta阶段计划 JuJu   冲刺时间:12月27日至1月5号(遇到节假日顺延)   人员: 陈灿: 项目经理 金华:负责算法优化与提升 婷婷:同上 恩升:绘图 胡凯:对比pytorch的basel ...

  9. ModelSim安装步骤

    刚成功安装了软件的我反手就是一篇安装步骤分享. 这是我自己创建的永久百度云链接. ModelSim10.7软件下载百度云链接 网址:https://pan.baidu.com/s/14oGZytocA ...

  10. Arch系统软件列表

    1. 安装统计 2. 安装列表 3. 安装说明 4. 作为依赖项的安装列表 5. 更正 mangaro使用减的方式安装系统.开箱即用的豪华版本,大部分人需要的都有了,同样包括个别用户不需要的,配置方面 ...