之前的几讲中我们曾经说过,JavaScript中是没有类的概念的。但是我们讲过对象,那么这个对象是怎么来的呢?

只要有函数即可创建对象

自定义对象

自定义对象的方式:

1. 使用无参的函数创建对象

  1. <script type="text/javascript">
  2. function Person(){}
  3. var p = new Person();
  4. //直接调用对象向对象中插入元素
  5. p.id = 123;
  6. p.name = "大熊";
  7. //插入方法元素时的操作
  8. p.say = function(){
  9. alert("我的名字叫做"+p.name);
  10. }
  11. document.write("编号:"+p.id + "姓名:"+p.name);
  12. p.say();
  13. </script>

如果再使用Person创建一个对象, 此时的对象不具备之前对象添加的元素。

2. 使用带参的函数创建对象

  1. function Person(id,name){
  2. this.id = id;
  3. this.name = name;
  4. this.say = function(){
  5. alert(name+"666");
  6. }
  7. }

这种方式和java中的构造方法类似,很好学,对吧。

3. 使用Object函数创建对象

  1. var p = new Object();
  2. p.id = 123;
  3. p.name = "大熊";

4. 使用字面量的方式创建

  1. var p = {
  2. id:123,
  3. name:"大熊",
  4. say:function(){
  5. alert(this.name+"666");
  6. }
  7. }

prototype原型

现在我们有这样一个需求,我们想给Array对象添加一些新的方法,但是正常的思路就是自定义一个工具对象,调用的时候先新建一个工具对象,将数组作为参数传入方法。这样其实是很麻烦的,为了简化操作,我们就用到了原型,使得方法可以直接用数组对象调用。

那么,什么是prototype原型呢?prototype是函数(function)的一个必备属性(书面一点的说法是”保留属性”)(只要是function,就一定有一个prototype属性)

prototype的特性如下:

  • prototype的值是一个对象
  • 可以任意修改函数的prototype属性的值
  • 一个对象会自动拥有prototype的所有成员属性和方法

具体使用方法如下代码:

  1. Array.prototype.getMax = function(){
  2. var max = this[0];
  3. for(var index = 1; index<this.length ; index++){
  4. if(this[index]>max){
  5. max = this[index];
  6. }
  7. }
  8. return max;
  9. }
  10. Array.prototype.searchEle = function(target){
  11. for(var i = 0 ; i<this.length ; i++){
  12. if(target==this[i]){
  13. return i;
  14. }
  15. }
  16. return -1;
  17. }
  18. //var arr = new Array(12,4,17,9);
  19. var arr = [12,4,17,9];
  20. var max = arr.getMax();
  21. var index = arr.searchEle(9);
  22. document.write("最大值:"+ max+"<br/>");
  23. document.write("索引值:"+ index+"<br/>");

练习:给字符串对象添加一个toCharArray的方法,然后再添加一个reverse(翻转)的 方法

  1. //先创建一个prototype对象(指向Object)
  2. function String(){
  3. this.prototype = new Object();
  4. }
  5. //使用原型
  6. String.prototype.toCharrArray = function(){
  7. var arr = new Array();
  8. for(var i=0;i<this.length;i++){
  9. arr[i] = this.charAt(i);
  10. }
  11. return arr;
  12. }
  13. String.prototype.reverse = function(){
  14. var arr = this.toCharrArray();
  15. arr.reverse();
  16. return arr.join(",");
  17. }

至此,JavaScript的基本语法所有内容介绍完毕。下面的几讲中我们将介绍其余两个部分的内容。

JavaScript学习总结(五)的更多相关文章

  1. JavaScript学习总结(五)——jQuery插件开发与发布

    jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...

  2. JavaScript学习总结(五)——Javascript中==和===的区别

    一.JavaScript"=="的作用 当==两边的内容是字符串时,则比较字符串的内容是否相等. 当==两边的内容是数字时,则比较数字的大小是否相等. 当==两边的内容是对象或者是 ...

  3. javascript学习第五课this、call、apply

    js函数与其它 高级语言相比有一个特点.没有返回值,一个简单函数就是function关键字+函数名字构成 this 对象是在运行中基于函数的执行环境绑定的,在全局函数中,this等于window,而当 ...

  4. JavaScript学习 - 基础(五) - string/array/function/windows对象

    String对象 更详细转:http://www.w3school.com.cn/jsref/jsref_obj_string.asp //------------------------------ ...

  5. JavaScript学习(五)

  6. arcgis api for javascript 学习(五) 实现地图绘制工具

    1.本文实现的功能为鼠标与地图之间的交互,能够在地图上绘制不同形状的图形 2.代码部分主要讲到的为Graphic函数的相关功能 <!DOCTYPE html> <html> & ...

  7. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

  8. JavaScript学习总结——转

    JavaScript学习总结(一)——JavaScript基础 JavaScript学习总结(二)——逻辑Not运算符详解 JavaScript学习总结(三)——逻辑And运算符详解 JavaScri ...

  9. JavaScript学习总结(2)——JavaScript数据类型判断

    最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断,在此做一个总结吧! 一.JS中的数据类型  1.数值型(Number):包括整数. ...

  10. 从零开始学习jQuery (五) 事件与事件对象

    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...

随机推荐

  1. golang 使用编译选项-H=windowsgui后,仍然输出log到console

    大概原理: 略略略... if debug { modkernel32 := syscall.NewLazyDLL("kernel32.dll") procAllocConsole ...

  2. [LeetCode] 929. Unique Email Addresses 独特的邮件地址

    Every email consists of a local name and a domain name, separated by the @ sign. For example, in ali ...

  3. 六十八、SAP中内表插入的三种方法之二,COLLECT的使用,用于计算数字字段之和

    一.使用COLLECT时,如果关键字没有,那么插入,如果有则求所有关键字列的和,代码如下 二.sy-index在循环中,每次循环从1开始递增 三.查看T_DATA数据 四.如下 五.循环时候,我们查看 ...

  4. 026-PHP常用字符串函数(三)

    <?php //颠倒字串 print("abcdefg 颠倒 "); print(strrev("abcdefg")."<hr>&q ...

  5. 072-PHP数组的交集和差集

    <?php $arr1=array(1,3,4,5,34,78,99); //参加第一项竞赛的学生学号数组 $arr2=array(5,6,7,3,56,34,8,9); //参加第二项竞赛的学 ...

  6. jsp页面使用<% 语句%> SQL Server数据库报空指针异常(在控制台可以正常执行)

    一直反感用SQL Server数据库,很影响电脑性能!!数据库作业不得不用 前几天作业一直报空指针异常: 自己检查了所传参数,和数组不为空 数据库查询语句不为空 然后查看SQL服务是否启动  主要是S ...

  7. JAVA基本数据类型和注释

    一.注释 1.注释的概念 注释是程序中给人看的提示信息,会被编译器忽略:在程序编译和执行过程中不会有任何影响,仅仅在代码阅读时提供提示信息. 2.注释的形式 基本语法://注释的内容   a.行注释 ...

  8. Apache部署Django+Vue

    首先部署Vue,后端项目django开5000端口,所以vue里的路由是ip:5000,然后打包npm run build 生成dist文件 把dist文件里的index.html和static放在/ ...

  9. python爬取网页文本、图片

    从网页爬取文本信息: eg:从http://computer.swu.edu.cn/s/computer/kxyj2xsky/中爬取讲座信息(讲座时间和讲座名称) 注:如果要爬取的内容是多页的话,网址 ...

  10. (转) Windows如何区分鼠标双击和两次单击

    Windows如何区分鼠标双击和两次单击 http://lbsloveldm.blog.hexun.com/12212875_d.html 在Windows平台上,鼠标左键的按下.松开.快速的两次点击 ...