一、JavaScript语言特点

1.1、JavaScript是基于对象和事件驱动的(动态的)

  它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页中执行了某种操作所产生的动作,就称为“事件”。比如按下鼠标,移动窗口,选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。

1.2、JavaScript是跨平台的

  JavaScript是依赖于浏览器本身的,与操作系统无关。

二、JavaScript变量

2.1、定义变量

  在定义变量时,统一使用"var 变量名"表示,例如:var str;甚至可以省略var这个关键字

2.2、JavaScript变量的类型如何决定

  JavaScript中变量的数据类型是由JS引擎决定的

1 var name="孤傲苍狼";//name是string类型
2 var age=24;//age是number类型
3 var flag=true;//flag是boolean类型
4 var email;//email只是声明,没有赋值,因此代表的类型是"undefined",也就是无法确定
5 name=10;//name自动变成了number类型

2.3、使用typeof关键字查看变量代表的具体数据类型

  typeof 运算符有一个参数,即要检查的变量或值。例如:

1 var sTemp = "test string";
2 alert (typeof sTemp); //输出 "string"
3 alert (typeof 86); //输出 "number"
对变量或值调用typeof运算符将返回下列值之一:
  • undefined - 如果变量是 Undefined 类型的
  • boolean - 如果变量是 Boolean 类型的
  • number - 如果变量是 Number 类型的
  • string - 如果变量是 String 类型的
  • object - 如果变量是一种引用类型或 Null 类型的

测试代码:

 1  <script type="text/javascript">
2 var name="孤傲苍狼";//name是string类型
3 alert("name是"+typeof name+"类型");
4 var age=24;//age是number类型
5 alert("age是"+typeof age+"类型");
6 var flag=true;//flag是boolean类型
7 alert("flag的类型是:"+typeof flag);
8 name=10;//name自动变成了number类型
9 alert("name变量重新赋值后,name的数据类型变成了:"+typeof name);
10
11 var email;//email只是声明,没有赋值,因此代表的类型是"undefined",也就是无法确定
12 alert("email的类型是:"+typeof email );
13 var a=null;
14 /*
15 为什么 typeof 运算符对于 null 值会返回 "Object"。
16 这实际上是 JavaScript 最初实现中的一个错误,然后被 ECMAScript 沿用了。现在,null 被认为是对象的占位符,从而解释了这一矛盾,但从技术上来说,它仍然是原始值。
17 */
18 alert("a是"+typeof a +"类型");
19 </script>

运行结果:

、JavaScript数据类型

  

  JavaScript包含两种不同数据类型:基本数据类型和引用数据类型。基本类型指的是简单的数据,引用类型指由多个值构成的对象。当我们把值赋值给一个变量时,解析器首先要做的就是确认这个值是基本类型值还是引用类型值。

3.1、基本数据类型

  常见的五种基本数据类型:

  1. Boolean
  2. Number
  3. String
  4. Undifined
  5. Null

  这五种基本数据类型可以直接操作保存在变量中的实际值

3.1.1、数值类型(Number)和布尔类型(Boolean)

  看下面的代码:

 1  <script type="text/javascript">
2 var a = 10;
3 var b = a;
4 b = 20;
5 alert("a="+a);//打印a=10
6
7 var b1 = true;
8 var b2 = b1;
9 b2 = false;
10 alert("b1="+b1);//打印b1=true
11 </script>

 运行结果:

  从运行结果可以看出,b的值是a值的一份拷贝,虽然,两个变量的值是相等,但是两个变量保存两不同的基本数据类型值。b只是保存了a复制的一个副本。所以,当b的值改变成20时,a的值依然是10。两个Boolean变量b1和b2同样是基本数据类型,同样保存两个不同的基本数据据类型值,b2保存1复制的一个副本。所以,当b2的值改变成false时,b1的值依然是true。

下图演示了这种基本数据类型赋值的过程:

3.1.2、字符串类型(String)

  JavaScript中的字符串String一个特殊的基本数据类型,在很多语言中,String是以对象的形式表示的,但在JavaScript里,String是当作一种基本数据类型,是通值传递的方式来操作。但它是一个比较特殊的基本类型。

看下面例子:

1  <script type="text/javascript">
2 var strA = "这是字符串";
3 var strB = strA;
4 strA = "这是另外一个字符串";
5 alert("strB="+strB);
6 </script>

运行结果:

  

  从运行结果可以看到,仿佛strA通过值传递的方式复制了一份给了strB。当strA改变的时候,strB并没有改变,似乎我们已经可以下结论,String就是个基本数据类型。

可是,因为String是可以任意长度的,通过值传递,一个一个的复制字节显示效率依然很低,看起来String也可以当作引用类型。

看下面例子:

1 var a = "myobject";
2 a.name = "myname";//为字符串a动态添加name属性
3 alert("a.name="+a.name); //访问a的name属性,结果显示:a.name=undefined

运行结果:

  

  运行结果显示,String无法当作一个对象来处理。这也证明了一点:基本类型虽然也可以添加属性,也不会报错,经测试添加完之后却是无法访问的,实际上,javascript里的String是不可以改变的,javascript也没有提供任何一个改变字符串的方法和语法。

看下面的例子:

1 var b = "myobject";
2 b = b.substring(3,5);
3 alert("b="+b); // b=bj

运行结果:

  

  这样做,没并有改变String字符串"myobject",只b引用了另一个字符串"bj","myobject"被回收了。

  所以可以这样讲,String实际上并不符合上面两种数据类型分类。它是具有两方面属性介于两都之间的一种特殊类型。

3.1.3、Null 类型

  Null类型只有一个专用值 null,值 undefined 实际上是从值 null 派生来的,因此 ECMAScript 把它们定义为相等的

1   <script type="text/javascript">
2 alert("null == undefined的结果是:"+(null == undefined)); //输出 "true"
3 </script>

运行结果:

  

  尽管这两个值相等,但它们的含义不同。undefined 是声明了变量但未对其初始化时赋予该变量的值,null 则用于表示尚未存在的对象(typeof 运算符对于 null 值会返回 "Object"。)。如果函数或方法要返回的是对象,那么找不到该对象时,返回的通常是
null。

3.1.4、Undefined 类型

  Undefined 类型只有一个值,即 undefined。当声明的变量未初始化时,该变量的默认值是 undefined。

1 var oTemp;

  前面一行代码声明变量 oTemp,没有初始值。该变量将被赋予值 undefined,即 undefined 类型的字面量。可以用下面的代码段测试该变量的值是否等于 undefined:

1  <script type="text/javascript">
2 var oTemp;
3 alert("oTemp == undefined的结果是:"+(oTemp == undefined));//输出 "true"
4 </script>

运行结果:

  

  运行结果显示 "true",说明这两个值确实相等。

  可以用 typeof 运算符显示该变量所代表的的数据类型是undefined类型

1   <script type="text/javascript">
2 var oTemp;
3 alert("typeof oTemp的结果是:"+typeof oTemp); //输出 "undefined"
4 </script>

  

  值 undefined 并不同于未定义的值。但是,typeof 运算符并不真正区分这两种值。考虑下面的代码:

1  <script type="text/javascript">
2 var oTemp;
3 alert("oTemp变量有声明,typeof oTemp的结果是:"+typeof oTemp); //输出 "undefined"
4 alert("oTemp2变量没有声明,typeof oTemp2的结果是:"+typeof oTemp2); //输出 "undefined"
5 </script>

运行结果:

  两个变量输出的都是 "undefined",即使只有变量 oTemp2 从未被声明过。如果对oTemp2 使用除 typeof 之外的其他运算符的话,会引起错误,因为其他运算符只能用于已声明的变量上。

  下面的代码将引发错误:

1 var oTemp;
2 alert(oTemp2 == undefined);//'oTemp2' 未定义

  当函数无明确返回值时,返回的也是值 "undefined",如下所示:

1 function testFunc() {
2 //这是一个空函数,没有返回值
3 }
4 alert("testFunc() == undefined的结果是:"+(testFunc() == undefined)); //输出 "true"

运行结果:

  

3.2、引用数据类型

  javascript引用数据类型是保存在堆内存中的对象,JavaScript不允许直接访问堆内存空间中的位置和操作堆内存空间,只能通过操作对象在栈内存中的引用地址。所以引用类型的数据,在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存在堆内存中的对象。

看下面的例子:

1 <script type="text/javascript">
2 var obj1 = new Object();
3 var obj2 = obj1;
4 obj2.name = "孤傲苍狼";
5 alert(obj1.name); // 孤傲苍狼
6 </script>

运行结果:

  

  由上面例子,我们声明了一个引用数据类型变量obj1,并把它赋值给了另外一个引用数据类型变量obj2。当我们obj2添加了一个name属性并赋值" 孤傲苍狼"。obj1同样拥有了和obj2一样的name属性。说明这两个引用数据类型变量指向同一个对象。obj1赋值给obj2,实际只是把这个对象在栈内存的引用地址复制了一份给了obj2,但它们本质上共同指向了堆内存中的同一个对象。

下面我们来演示这个引用数据类型赋值过程

  

  自然,给obj2添加name属性,实际上是给堆内存中的对象添加了name属性,obj2和obj1在栈内存中保存的只是堆内存对象的引用地址,虽然也是拷贝了一份,但指向的对象却是同一个。故而改变obj2引起了obj1的改变。

  一般而言,基本数据类型是由固定数目的字节组成,这些字节可以在解析器的较底层进行操作,比如Number和 Boolean;而引用数据类型,可以包含任意数目的属性和元素,因此它们无法像基本数据类型那样很容易的操作。由于,引用数据类型的值是会发生变化的, 所以通过跟基本数据类型一样的值传递方式,也就没什么意义了,因为会牵涉到大量的内存的复制和比较,效率太低。所以引用数据类型是通过引用传递方式,实际传递的只是对象的一个地址。比如Array和Function,因为它们都是特殊的对象所以它们都是引用类型。另外,引用类型是可以添加属性,基本类型虽然也可以添加属性,也不会报错,经测试添加完之后却是无法访问的

JavaScript学习总结(1)——JavaScript基础的更多相关文章

  1. JavaScript学习(1)之JavaScript基础

    JavaScript学习(1)之JavaScript基础 由于工作原因,开发语言逐渐以JavaScript为主,所以,抽空学习了下JavaScript语法.等现阶段的工作稳定之后,陆续会分享下自己在学 ...

  2. JavaScript学习(6)-文档对象模型基础

    JavaScript学习6-文档对象模型基础 1.节点方法 节点对象方法(W3C DOM Level2) 方法 说明 appendChild(newChild) 添加子节点到当前节点的末端 clone ...

  3. Javascript学习笔记1 javascript的特点

    ..对于网页而言,Javascript无处不在,对于英语不好的人它简直是噩梦般的存在,但形式所逼,今天开始着手学习!希望自己能坚持下去.从什么地方着手,我的目标是从大处着眼,从应用着眼,不抠细节,反正 ...

  4. Javascript学习笔记3 Javascript与BOM简介

    什么是BOM BOM是browser object model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象 ...

  5. JavaScript学习笔记(4)——JavaScript语法之变量

    一.变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume). 变量必须以字母开头 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做 ...

  6. JavaScript学习笔记1之基础知识点

    一.什么是JavaScrip JavaScript是一种动态类型.弱类型.基于原型的客户端脚本语言.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,在HTML网页 ...

  7. JavaScript学习小结(一)——JavaScript入门基础

    一.JavaScript语言特点 1.1.JavaScript是基于对象和事件驱动的(动态的) 它可以直接对用户或客户输入做出响应,无须经过Web服务程序.它对用户的响应,是采用以事件驱动的方式进行的 ...

  8. JavaScript学习总结(一)——JavaScript基础

    一.JavaScript语言特点 1.1.JavaScript是基于对象和事件驱动的(动态的) 它可以直接对用户或客户输入做出响应,无须经过Web服务程序.它对用户的响应,是采用以事件驱动的方式进行的 ...

  9. JavaScript学习(一)——基础知识查漏补缺

    标签script 我们知道,html要使用js就要使用<script>标签. 两种方式: 一是直接在<script>这里</script>写入代码. 二是在别的文件 ...

  10. 【JavaScript学习整理】js基础

    HTML,CSS属于标记语言, JavaScript是基于客户端的脚本语言. 变量: 语法  var 变量名 = value var是系统内部关键字,用来声明变量 变量名规则:  1.不能以数字开头  ...

随机推荐

  1. 7-07. PAT排名汇总(25) (结构体 ZJU_PAT)

    题目链接:http://www.patest.cn/contests/ds/7-07 编程能力測试(Programming Ability Test,简称PAT)是浙江大学计算机科学与技术学院主办的专 ...

  2. hdoj--2955--Robberies(背包好题)

    Robberies Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total ...

  3. MySQL外键的介绍

    在MySQL 3.23.44版本后,InnoDB引擎类型的表支持了外键约束. 1.MySQL中“键”和“索引”的定义相同,所以外键和主键一样也是索引的一种.不同的是MySQL会自动为所有表的主键进行索 ...

  4. [USACO07JAN]平衡的阵容Balanced Lineup RMQ模板题

    Code: #include<cstdio> #include<algorithm> using namespace std; const int maxn = 50000 + ...

  5. selenium 窗口句柄之间的切换

    以前使用selenium时都是在单窗口的模式下,本次新增多窗口下的窗口之间切换 from selenium import webdriver from selenium.webdriver.commo ...

  6. CSUOJ 1551 Longest Increasing Subsequence Again

    1551: Longest Increasing Subsequence Again Time Limit: 2 Sec  Memory Limit: 256 MBSubmit: 75  Solved ...

  7. NumPy基础入门学习

    对于习惯使用了MATLAB的用户而言,学习NumPy这个python工具包付出的成本应该是不大的. NumPy的基本的object是多维数组,是一个有同样类型的数字等构成的一张表格,能够通过元组进行索 ...

  8. Spring MVC原理及实例基础扫盲篇

    近期 项目中刚接触了SpringMVC,就把这几天看的跟实践的东西写出来吧. 一.首先,先来了解一下SpringMVC究竟是个什么样的框架? Spring Web MVC是一种基于Java的实现了We ...

  9. 解决wget下载文件名乱码的一些方法

    在下载用apache或者nginx做的索引目录时,遇到文件名乱码问题.搜索了不少资料,尝试了好几种方案,大家可以结合使用. 一般情况下加上–restrict-file-names=nocontrol参 ...

  10. ajax ---- json 和 xml 区别

    2.XML和JSON优缺点 (1).XML的优缺点<1>.XML的优点 A.格式统一,符合标准: B.容易与其他系统进行远程交互,数据共享比较方便.<2>.XML的缺点 A.X ...