JavaScript 学习笔记(三)

本章学习内容:

1.数组的使用

2.类和对象细节.

3.this关键字的使用

4.构造函数,成员函数的使用

1.数组的使用

  在任何的语言中,必须要有的就是数组了,有了数组,使得很多操作都变得非常的方便。。JS里面也是包含着

数组的,JS里的数组和JAVA里的数组在用法上基本相同,只是自己多了些特性。。。。下面来看一段代码。。。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript" type="text/javascript">
     //第一种创建方式
     var array=new Array();
     //var array=new Array(2);
     array[0]=1;
     array[1]="ab";
     array[2]="ac";     //array[3]="ss";
     for(var i=0;i<arr.length;i++)
     {
         document.write(array[i]);
     }
     //第二种创建方式
     var array1=("java","c++","python");
     for(var i=0;i<arr.length;i++)
     {
         document.write(array1[i]);
     }

</script>

</head>

<body>
</body>
</html>

  上述涉及的只是数组的创建。。数组的创建可以有两种方式,其实上述注释部分,也是创建数组的方法。。

区别在于,注释部分直接给出了数组的初始长度为3,但是我们知道JS是动态的语言,就算是我们指定了数组

的初始长度,当我们存储的数据大于其长度的时候,JS仍然会动态的开辟新的地址空间,并不像java那样,

一旦指定了数组的长度,那就不允许越界。。。

  相关数组的常用方法

1.concat(Array1.conact(array2,array3))合并两个或者多个数组。。

2.length()取数组的长度

3.toString()把字符串转化为数组,并返回结果

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript" type="text/javascript">
     //第一种创建方式
     var array=new Array();
     //var array=new Array(2);
     array[0]=1;
     array[1]="ab";
     array[2]="ac";
     document.writeln(array.toString());//转化为字符串
     var array1=new Array("java","c++","python");
     document.writeln(array.concat(array1));//合并两个数组
     document.write(array.length);
     for(var i=0;i<array.length;i++)//取length长度
     {
         document.write(array[i]);
     }

</script>

</head>

<body>
</body>
</html>

  上面使用三种方法,这里只是简单的介绍了几个常用方法,后续还会说到数组的其他方法。。。我们可以

看到,在合并了两个数组之后,两个数组的length并没有增加,并不是合并后数组的长度就会改变。。。。

2.类和对象细节:

  JS中也是有类和对象的。。。

<script language="javascript" type="text/javascript">
     person=new Object();//新建对象,并为对象添加属性
     person.firstname="Bill";
     person.lastname="Gates";
     person.age=56;
     person.eyecolor="blue";
     //第二种建立方式...定义一个构造函数
     function person1(firstname,lastname,age,eyecolor)
     {
         var name="ss";//私有的..
         this.firstname=firstname;//公有的
         this.lastname=lastname;
         this.age=age;
         this.eyecolor=eyecolor;
         this.show=function()//公有函数
         {
             window.alert("...");
         }
     }
     per=new person1("tom","john",25,"yellow");
     document.writeln(per.firstname+" "+per.lastname+" "+per.age+" "+per.eyecolor);

</script>

  很简单的实现了对象的创建...在建立了对象之后,我们可以直接为对象添加属性.也可以建立对象

调用类方法。。我们可以看到,在JS中只有公有和私有两种权限,并且公有的成员或函数使用this关

键字来实现的。

  补充个知识点。对象引用

<script language="javascript" type="text/javascript">
     function person(){}
     var a=new person();
     a.name="小明";
     a.age="10";
     var b=a;
     b.name="小白";     //此时对象的引用次数为2
     window.alert(a.age+" "+a.name);//小白 10
     window.alert(b.age+" "+b.name);//小白 10
     b=null;//对象的引用次数为1
     window.alert(a.age+" "+a.name);//小白 10
     window.alert(b.age+" "+b.name);//undefined undefined     a=null;//对象的引用次数为0(gc就启动了回收机制)
</script>

上面涉及的就是对象的引用。。。对象的引用就涉及到了一个GC(对象回收机制)。。a和b都指向了同一个地址。。

这个地址在一个堆区中,堆区保存了这个对象的所有属性。。GC会根据对象的调用的次数来判断是否回收对象。。

3.this关键字

为了在建立对象的时候避免每次都为对象分配变量。。。因此使用this关键字。。。

<script language="javascript" type="text/javascript">
     function person()
     {
         this.name="abc";         //var name="sss";
         this.age="10";
     }
     var p1=new person();
     var p2=new person();
         p2.name="ss";//改变了p2的值不会影响到p1
     document.write(p1.name+" "+p2.name);
</script>

 这样就在每次建立对象的时候实现了对象的初始化。。。并且this关键字的使用使得person中的成员编程公有的。。我们

可以在外部进行访问。。。在外部其实也是可以访问私有成员的。。我们只需要在person内部中定义一个this的公有函数,

然后在内部调用函数,我们就可以访问其中的私有成员了。。

总而言之一句话就是:哪个对象实例调用this所在的函数,那么this就代表哪个对象。。

<script language="javascript" type="text/javascript">
      function test()//函数默认为window对象
      {
          alert(this.v);
      }
      var v=90;
      test();//输出90
</script>

上面代码输出结果为90.那么调用了test()<==>window.test(),就代表调用了window对象。。this.v就代表window.v<==>var v。。

注意:this只能在类中使用。。不能在外部使用。。。

4.构造函数以及成员函数

<!DOCTYPE html>
<html>
<head>
<B>CONSTRUCTOR AND PROTOTYPE<br><br></B>
</head>
<body>
<script type = "text/javascript">
    /*************************CONSTRUCTOR**********************/
    var Person = function(name){
        this.name = name;
    };

    var Person = function(name, age){
        this.name = name;
        this.age = age;
    };

    /*************************PROTOTYPE************************/

    Person.prototype.getName = function(){    //member function: getName();
        return this.name;
    };

    Person.prototype.getAge = function(){     //member function: getAge();
        return this.age;
    };

    /********************TEST**********************************/

    var person1 = new Person("John");   // use constructor 1 @param: name

    var person2 = new Person("Peter",2); // use constructor 2 @param: name, age

    document.write("person1=>name: " + person1.getName() + ", Person1=>age: " + person1.getAge() + "<br>");

    document.write("Person2=>name: " + person2.getName() + ", Person2=>age: " + person2.getAge() + "<br>");

</script>
</body>

</html>

其中prototype部分形式还可以是,

    /*************************PROTOTYPE************************/
    Person.prototype = new Object({
        getName: function(){
            return this.name;
        },
        getAge: function(){
            return this.age;
        }
    });

  

  

  

  

时间: 2024-08-22 19:23:32

JavaScript 学习笔记(三)的相关文章

JavaScript学习笔记(三)——this、原型、javascript面向对象

一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化,当然也可以使用call.apply修改this指向的对象.它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用 1.1.JavaScript中函数与方法的区分 在面向过程的语言中我们习惯把完成某个特定功能的代码块称为“函数”或“过程”,当然过程一般没有返回值.在面向对象语言中我们把对象的功能

JavaScript学习笔记三:JavaScript对象

一.前言 对象的基本概念:Javascript提供了多个内建对象,比如String.Data.Array等等.对象指的是带有属性和方法的特殊数据类型 创建对象:创建JavaScript对象主要有两种不同的方法:第一.定义创建对象的实例:第二,使用函数来定义对象,然后创建新的对象 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.

前端乱煮之javascript学习笔记三

1 DOM即为文档对象模型,在html页面加载完成后,浏览器会创建页面的文档对象模型,它看来像是一棵树,有根节点,以及其他的节点. 而通过可编程的对象模型,javascript可以获得创建动态HTML的能力.比如,javascript可以改变HTML所有的元素.可以改变这些元素的属性.可以改变这些元素的样式和能对该页面内的事件作出反应. 2 要想对页面内的元素进行操作,首先就要获得这个元素.通常有三种获得元素的方法,分别是 通过Id来获得元素: 通过标签来获得元素: 通关类名来获得元素: 3 通

JavaScript学习笔记三:基本概念(1)

1. JS中的一切(变量.函数名.操作符等)都区分大小写.--true是boolean值,而True只是标识符. 2. JS语句以分号结尾,但不是必需的,原因: a. 结尾没有分号有时会导致压缩错误. b. 加上分号在某些情况下会为解析器提供方便,增进代码的性能. 3. 不同的ECMAScript版本对关键字和保留字的定义不同,但最好在JS代码中永远都不用任何关键字和保留字,以便与将来的ECMAScript版本兼容. 4. ECMAScript的变量是松散类型的,就是一个变量没有特定的类型限制,

javascript学习笔记(三) string对象中的正则表达式

1. search返回匹配到的位置(-1找不到) var str = 'html js' var pattern = /js/ str.search(pattern)    --------->5 2. Match str.match(pattern) --------['js'] /js/g -----> ["js", "js",,"js"] match vs exec match:非全局的情况下才会返回分组中匹配到的内容,全局匹配

javascript学习笔记---ECMAScript语法(引用类型)

引用类型通常叫做类(class). 本教程会讨论大量的 ECMAScript 预定义引用类型. 引用类型 引用类型通常叫做类(class),也就是说,遇到引用值,所处理的就是对象. 本教程会讨论大量的 ECMAScript 预定义引用类型. 从现在起,将重点讨论与已经讨论过的原始类型紧密相关的引用类型. 注意:从传统意义上来说,ECMAScript 并不真正具有类.事实上,除了说明不存在类,在 ECMA-262 中根本没有出现"类"这个词.ECMAScript 定义了"对象定

JavaScript--基于对象的脚本语言学习笔记(三)

事件处理器 1.一个数据校验表单的例程 <html> <head> <title>js练习</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript"> String.prototype.trim=function(){ r

JavaScript学习笔记【2】表达式和运算符、语句、对象

笔记来自<JavaScript权威指南(第六版)> 包含的内容: 表达式和运算符 语句 对象 表达式和运算符 数组直接量中的列表逗号之间的元素可以省略,这时省略的空位会填充值undefined.元素列表末尾可以留下单个逗号,这时并不会创建一个新的值为undefined元素. 属性访问表达式,.identifier的写法只适用于要访问的属性名称是合法的标识符,并且需要知道要访问的属性的名字.如果属性名称是一个保留字或者包含空格和标识符,或是一个数字(对于数组来说),则必须使用方括号的写法.当属性

JavaScript学习笔记【3】数组、函数、服务器端JavaScript概述

笔记来自<JavaScript权威指南(第六版)> 包含的内容: 数组 函数 服务器端JavaScript概述 数组 数组是动态的:根据需要它们会增长或缩减,并且在创建数组时无须声明一个固定的大小或在数组大小变化时无须重新分配空间. 数组可能是稀疏的:索引不一定要连续的,它们之间可以有空缺. 通常,数组的实现是经过优化的,用数字索引来访问数组元素一般来说比访问常规的对象属性要快很多. 数组继承自Array.prototype中的属性,它定义了一套丰富的数组操作方法. 如果省略数组直接量中的某个

javascript学习笔记---ECMAScript运算符(位运算符)

位运算符是在数字底层(即表示数字的 32 个数位)进行操作的. 位运算 NOT 位运算 NOT 由否定号(~)表示,它是 ECMAScript 中为数不多的与二进制算术有关的运算符之一. 位运算 NOT 是三步的处理过程: 把运算数转换成 32 位数字 把二进制数转换成它的二进制反码 把二进制数转换成浮点数 例如: var iNum1 = 25; //25 等于 00000000000000000000000000011001 var iNum2 = ~iNum1; //转换为 11111111