`

javascript一些基础

    博客分类:
  • Web
 
阅读更多

闭包: 1.闭包最常用的方式就是返回一个内联函数 (何为内联函数?就是在函数内部声明的函数);

    2.在JavaScript中有作用域和执行环境的问题,在函数内部的变量在函数外部是无法访问的,在函数内部却可以得到全局变量。由于种 种原因,我们有时候需要得到函数内部的变量,可是用常规方法是得不到的,这时我们就可以创建一个闭包,用来在外部访问这个变量。

    3.闭包的用途 主要就是上一点提到的读取函数内部变量,还有一个作用就是可以使这些变量一直保存在内存中。

    4.使用闭包要注意,由于变量被保存在内存中,所以会对内存造成消耗,所以不能滥用闭包。解决方法是 在退出函数之前,将不使用的局部变量全部删除。

    最后还是上一套闭包的代码吧,这样更直观。

<script type="text/javascript">
   function f(){
    var n = 999;
    function f1(){
     alert(n+=1);
    }
    return f1;
   }
   var result = f();
   result(); // 1000
   result(); // 1001
   result(); // 1002
</script>

 

封装: 通过将一个方法或者属性声明为私用的,可以让对象的实现细节对其他对象保密以降低对象之间的耦合程度,可以保持数据的完整性并对其修改方式加以约束,这样可以是代码更可靠,更易于调试。封装是面向对象的设计的基石。

  尽管JavaScript是一门面向对象的语言,可它并不具备将成员声明为公用或私用的任何内部机制,所以我们只能自己想办法实现这种特性。下面还是通过一套完整的代码去分析,介绍什么是私有 属性和方法,什么是特权 属性和方法,什么是 属性和方法,什么是 静态 属性和方法。

  私有属性和方法: 函数有作用域,在函数内用var 关键字声明的变量在外部无法访问,私有属性和方法本质就是你希望在对象外部无法访问的变量。

  特权属性和方法: 创建属性和方法时使用的this关键字,因为这些方法定义在构造器的作用域中,所以它们可以访问到私有属性和方法;只有那些需要直接访问私有成员的方法才应该被设计为特权方法。

  共有属性和方法: 直接链在prototype上的属性和方法,不可以访问 构造器内的私有成员,可以访问特权成员,子类会继承所有的共有方法。

  共有静态 属性和方法: 最好的理解方式就是把它想象成一个命名空间,实际上相当于把构造器作为命名空间来使用。

 

    /* -- 封装 -- */
    var _packaging = function(){
       //私有属性和方法
       var name = 'Darren';
       var method1 = function(){
          //...
       }
       //特权属性和方法
       this.title = 'JavaScript Design Patterns' ;
      this.getName = function(){
         return name;
     }
   }
   //共有静态属性和方法
   _packaging._name = 'Darren code';
   _packaging.alertName = function(){
      alert(_packaging._name);
   }
   //共有属性和方法
   _packaging.prototype = {
      init:function(){
         //...
      }
   }

 

继承: 继承 本身就是一个抽象的话题,在JavaScript中继承更是一个复杂的话题,因为JavaScript想要实现继承有两种实现方式,分别是类式继承和原型式继承,每种实现的方式都需要采取不少措施,下面本人通过分析例子的方式讲解 JavaScript中这个很重要的话题。

 

<script type="text/javascript">
    /* -- 类式继承 -- */
  //先声明一个超类
    function Person(name){
      this.name = name;
    }
    //给这个超类的原型对象上添加方法 getName 
    Person.prototype.getName = function(){
      return this.name;
    }
    //实例化这个超类
    var a = new Person('Darren1')
    alert(a.getName());
    //再声明类
    function Programmer(name,sex){
    //这个类中要调用超类Person的构造函数,并将参数name传给它
      Person.call(this,name);
      this.sex = sex;
    }
    //这个子类的原型对象等于超类的实例
    Programmer.prototype = new Person();
    //因为子类的原型对象等于超类的实例,所以prototype.constructor这个方法也等于超类构造函数,你可以自己测试一下,如果没这一步,alert(Programmer.prototype.constructor),这个是Person超类的引用,所以要从新赋值为自己本身
    Programmer.prototype.constructor = Programmer;
    //子类本身添加了getSex 方法
    Programmer.prototype.getSex = function(){
      return this.sex;
    }
    //实例化这个子类
    var _m = new Programmer('Darren2','male');
    //自身的方法
    alert(_m.getSex());
    //继承超类的方法
    alert(_m.getName());
</script>
 
分享到:
评论

相关推荐

    JavaScript基础语法(ppt)

    JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)...

    JavaScript js基础学习 示例代码

    JavaScript js基础学习 示例代码JavaScript js基础学习 示例代码JavaScript js基础学习 示例代码JavaScript js基础学习 示例代码JavaScript js基础学习 示例代码JavaScript js基础学习 示例代码JavaScript js基础...

    javascript基础练习,一些有趣的小游戏

    javascript基础练习,一些有趣的小游戏javascript基础练习,一些有趣的小游戏javascript基础练习,一些有趣的小游戏javascript基础练习,一些有趣的小游戏javascript基础练习,一些有趣的小游戏javascript基础练习,...

    JavaScript基础教程(第8版) 高清版 mobi

    《javascript基础教程(第8版)》循序渐进地讲述了javascript 及相关的css、dom、ajax、jquery 等技术。书中从javascript 语言基础开始,分别讨论了图像、框架、浏览器窗口、表单、正则表达式、用户事件和cookie,并...

    HTML5+JavaScript动画基础(文本+源码)

    在“HTML5+JavaScript动画基础”这个主题中,我们深入探讨如何利用这两者构建引人入胜的动画效果。 首先,HTML5新增了许多元素和API,如canvas标签,它提供了一个画布,允许开发者通过JavaScript绘制图形并实现动态...

    javascript基础教程 从入门到精通

    javascript 基础 教程 入门 精通 javascript 基础 教程 入门 精通 javascript 基础 教程 入门 精通 javascript 基础 教程 入门 精通 javascript 基础 教程 入门 精通 javascript 基础 教程 入门 精通 javascript ...

    《HTML5+JavaScript动画基础》源代码

    在《HTML5+JavaScript动画基础》一书中,作者深入浅出地讲解了如何利用这两者来构建吸引人的动画和游戏。下面,我们将探讨这个主题中涉及的一些关键知识点。 1. **HTML5新特性**: HTML5是HTML的最新版本,引入了...

    JavaScript基础教程(pdf版)

    本教程旨在为初学者提供一个全面的JavaScript基础知识学习平台,帮助理解并掌握这种强大的脚本语言。 《JavaScript基础教程》首先会介绍JavaScript的历史背景和基本语法,包括变量、数据类型、操作符、流程控制...

    基于Javascript编程基础知识基于Javascript编程基础知识基于Java基于Javascript编程基础知识.zip

    基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程基础知识基于Javascript编程...

    javascript教案 JavaScript基础

    javascript教案 JavaScript基础 【实例简介】javascript教案 javascript学习指导,语法基础的指导及编写格式和方法的说明 第一章 概述 4 1.1 JavaScript的由来 4 1.2 什么是JavaScript 4 1.3 JavaScript的特点...

    JavaScript基础知识例子

    总的来说,这个压缩包提供了一个全面的JavaScript基础知识教程,涵盖了数据类型、Object、内置对象和变量等核心概念,对于初学者或者需要巩固基础的开发者来说,是一份非常有价值的参考资料。通过学习这些内容,可以...

    零基础学会javascript

    "零基础学会JavaScript"的学习之旅将带你逐步掌握这门语言的基础到高级技巧。 首先,JavaScript的核心概念是变量、数据类型和操作符。变量用于存储数据,可以随时改变其值。数据类型包括基本类型(如字符串、数字、...

    JavaScript_语言基础.pdf

    课程面向对前端开发感兴趣的后端开发人员,目标是使学员通过学习JavaScript基础,能够理解JavaScript的基本原理,并通过实例演示加深理解。在课程中,学员将完成一些基础的JavaScript习题,并在后续的工作中能够读懂...

    JavaScript视频教程零基础学起

    一整套JavaScript视频教程,适合零基础新入行的朋友学习

    JavaScript基础知识总结

    JavaScript 基础教程 JavaScript 是一种广泛应用于网页和网络应用的轻量级编程语言,它主要用于增强网页的交互性和动态功能。JavaScript 能够直接嵌入 HTML 页面中,为设计师提供了一种无需深入编程就能实现动态...

    HTML5 JavaScript动画基础

    书中可能包括了基础的动画原理、JavaScript语法在动画中的应用、如何使用Canvas和SVG进行绘图、以及如何利用WebGL制作3D动画等内容。此外,书中可能还会讲解到性能优化技巧,比如使用requestAnimationFrame来平滑...

    Javascript基础.xmind

    JavaScript基础三天总结

    javascript基础视频80集11

    在“javascript基础视频80集8”中,可能涵盖了以上部分或全部内容,并且可能深入讲解了一些实际案例和最佳实践,帮助学习者将理论知识应用到实际项目中。 压缩包内的“js视频54-56”可能分别对应JavaScript中的特定...

    javascript基础语法总结.pdf

    这个资源是javaScript基础语法的总结,适合学完javascript基础语法的进行巩固、复习! 这...我是想免费给大家看的,这怎么还收费

Global site tag (gtag.js) - Google Analytics