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. java学习-初级入门-面向对象②-面向对象概述-面向对象程序设计

    我们在  面向对象①中学习了,结构化程序设计. 今天我们一起学习面向对象程序设计. 学习面向对象程序设计就要了解,在面向对象中重要的知识点. 继承  .  多态   . 抽象  . 接口 我们会在接下 ...

  2. VUE.JS和小程序的共通之处

    我是先学习的小程序开发,之后才了解到vue.js.也是一直没有时间去看相关vue.js的知识和内容.现在回顾起来,小程序和vue.js都是前端的内容. 例如小程序中的目录结构物page+app.js+ ...

  3. 从0开始完成SpringBoot+Mybatis实现增删改查

    1.准备知识: 1)需要掌握的知识: Java基础,JavaWeb开发基础,Spring基础(没有Spring的基础也可以,接触过Spring最好),ajax,Jquery,Mybatis. 2)项目 ...

  4. 运算符 Operator 及优先级

    算数运算符 + - * / ** % /表示自然除,结果是浮点数.//为整除.python2.x版本/和//都是整除. 位运算符 & | ~ ^ << >> <& ...

  5. Python数据分析在互联网寒冬下，数据分析师还吃香吗？

    伴随着移动互联网的飞速发展,越来越多用户被互联网连接在一起,用户所积累下来的数据越来越多,市场对数据方面人才的需求也越来越大,由此也带火了如数据分析.数据挖掘.算法等职业,而作为其中入门门槛相对较低. ...

  6. Unity ShaderLab 学习笔记（一）

    因为项目的问题,有个效果在iOS上面无法实现出来- 因为shader用的HardSurface的,在android上面跑起来没有问题- 以为在iOS上也不会有问题,但是悲剧啊,技能效果一片漆黑- 而且 ...

  7. 使用loadrunner监控apcahe资源

    一般要修改的内容在Httpd.conf文件中已经存在,如果不存在请自行添加相应内容. (1)修改Apache中Httpd.conf文件, (2)添加ExtendedStatus,设置ExtendedS ...

  8. 常用keycode列表

    KEYCODE列表 电话键   KEYCODE_CALL 拨号键 5 KEYCODE_ENDCALL 挂机键 6 KEYCODE_HOME 按键Home 3 KEYCODE_MENU 菜单键 82 K ...

  9. QQ企业通---DllImport

    1.DllImport 是什么? DllImport是System.Runtime.InteropServices命名空间下的一个属性类,其功能是提供从非托管DLL(托管/非托管是微软的.net fr ...

  10. vscode spring boot配置文件application.properties不提示解决方式

    背景 因实际的编程环境是jdk1.6,vscode安装了spring boot tools开发后,application.properties无法提示.spring boot tools的功能之一就是 ...