带领大家学习javascript基础篇(一)之基本概念

学习目录

一、数据类型

数据类型

二、操作符

递增和递减操作符:

位操作符:
布尔操作符:
加性操作符:
相等操作符

三、语句
for-in语句
label语句

一、数据类型

数据类型

基本数据类型(五种)

Undefined
Null
Boolean
Number
String

复杂数据类型(一种)

Object
Undefined:只有一个值undefined(定义了没有赋值)。

例:

var str;alert(str);//undefined

注意:如果没有用var申明,直接使用会报异常( ... is not defined)。

建议:每次var声明都赋初始值,可以减少很多意外情况。

如:

var str;var str2="张三";str = str + str2;alert(str);//并不是我们意料中的“张三”

Null:略

Boolean:只有两个字面值: true 和 false。

任何数据类型通过Boolean()函数都可以转成Boolean类型。

String:非空字符=>true     空字符=>false
Number:任何非零=>true   0和NaN=>false
Object:任何对象=>true      null=>false
Undefined                        undefined=>false

如:

var str = Boolean(NaN);var str2 = Boolean("张三");var str3 = Boolean(undefined);alert(str+" "+str2+" "+str3);

既然如此,我们在使用if语句的时候会自动执行相应的 Boolean 转换。

if (str) {
  //str只要是非空字符、任何非零数字、任何非null对象 都是true
  //str只要是空字符、0、NaN、null、undefined 都是false
  //这样就省去了 我们一个个的判断了
  alert("true");
}

String:略

二、操作符

递增和递减操作符:

【++num、--num、num++、num--】

var age = 3, age2 = 3;age++;++age2;alert(age+" "+age2);

都是4,好像看不出有什么不同。

var age = 3, age2 = 3,num1 ,num2;num1 = age++ + 1;num2 = ++age2 + 1;alert(num1+" "+num2);

好,区别来了。一个任然是4,一个变成了5。为什么会这样呢?优先级不同而已,age++先执行运算符+然后在自身加1,++age先自身加1然后再通过+运算符加1。

位操作符:

【按位非NOT(~)、按位与AND(&)、按位或OR(|)、按位异或XOR(^)、左移(<<)、有符号的右移(>>)、无符号右移(>>>)】
其实平时我们很少用到,这里稍作了解。

例:按位非

var num1 = 25; // 二进制 00000000000000000000000000011001
var num2 = ~num1; // 二进制 11111111111111111111111111100110
alert(num2); // -26

例:按位与

var result = 25 & 3;
alert(result); //1
//*********************
25 = 0000 0000 0000 0000 0000 0000 0001 1001
3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0001 

例:按位异或

var result = 25 ^ 3;
alert(result); //26
//*************
25 = 0000 0000 0000 0000 0000 0000 0001 1001
3 = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
XOR = 0000 0000 0000 0000 0000 0000 0001 1010 //十进制值 26

例:左移

var oldValue = 2; // 等于二进制的 10
var newValue = oldValue << 5; // 等于二进制的 1000000,十进制的 64

例:有符号右移

var oldValue = 64; // 等于二进制的 1000000
var newValue = oldValue >> 5; // 等于二进制的 10 ,即十进制的 2 

例:无符号右移(这个差异有点大,因为第32为1代表负数的值也移过来了)

var oldValue = -64; // 等于二进制的 11111111111111111111111111000000
var newValue = oldValue >>> 5; // 00000111111111111111111111111110 等于十进制的 134217726

布尔操作符:

【逻辑非(!)、逻辑与(&&)、逻辑或(||)】

这里需要说的就是&&和||是短路操作。||如果前面一个满足条件了就不检测后面的条件了,&&相反前面一个不满足条件就不检测后面的条件了。

例:

var age = 3;
if(age||aaa){//这里的age转Boolean为ture,所以后面的aaa就不检测了。
alert(age);}
if(aaa||age){//这里将会报错
alert(age);}

测试:

var age = 3;if(age||aaa){//这里的age转Boolean为ture,所以后面的aaa就不检测了。alert(age);}if(aaa||age){//这里将会报错alert(age);}

这里可以告诉大家一个小小的技巧,很多时候我们并不知道某个变量是否有值,但是我们又需要正常使用,那么我们可以给个备胎。

如:浏览器的兼容问题,在旧式浏览器中是用window.event来取事件的相关属性值,新式浏览器中是直接通过形参的形式传过来的。我们就可以。

function myonclick(ev) {
  var myevent = ev || window.event;//这样就可以保证新旧浏览器的兼容了
}

实验:  

var obj = null;var obj2 = obj||"备胎";alert(obj2);

加性操作符:

【加法(+)、减法(-)】

这个再熟悉不过了,不过还是有一点需要注意。

var strnum1 = "5";
var num2 = strnum1 + 3;
var num3 = strnum1 - 3;
alert("num2="+num2+" num3="+num3);//这里会是什么结果呢?

让我们来测试一下吧。

var strnum1 = "5";var num2 = strnum1 + 3;var num3 = strnum1 - 3;alert("num2="+num2+" num3="+num3);//这里会是什么结果呢?

为什么会这样?字符串和数字相加,数字会转为字符串。字符串和数字相减,字符串转为数字。

相等操作符

var num1 = "5";var num2 = 5;var isEqual = num1==num2;alert("num1是否等于num2:"+ isEqual);

奇怪吧,字符串怎么和数字相等。是的,这里用到了自动转型。但是,我们不想看到这样的结果怎么办?

var num1 = "5";var num2 = 5;var isEqual = num1===num2;alert("num1是否等于num2:"+ isEqual);

是的,我们可以用===全等于。不仅比较数值,还比较类型。

三、语句

for-in语句

for循环语句用得多,for-in可能平时就用的较少了。(for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。)

例:

var obj = {id:2,name:"张三"};var str = "";for(o in obj){ str += "属性:"+ o + " 值:" + obj[o] + " ";}alert(str);

label语句

感觉和C#中的goto很像,但又不一样。

我们平时有没有过在多个循环嵌套里面想跳出第二层循环?一般我们只能用break或者continue跳出最里面的循环,或者return跳出整个函数。万万没想到的是,还有一个label语句,可以跳出任意层循环。
例:

var num = 0;outermost:for (var i=0; i < 10; i++) { for (var j=0; j < 10; j++) { if (i == 5 && j == 5) { break outermost; } num++; }}alert(num); //55

好了,第一篇差不多就整理到这里了。最后出几个有趣的题目给大家。

一、为什么 1=0.9999999999……
二、为什么 alert(0.1 + 0.2)//0.30000000000000004
三、为什么 alert(0123 + 4)//87

四、

var obj1 = {}; obj1.name2 = "张三";
var str1 = "test"; str1.name2 = "李四";
alert(obj1.name2 + " " + str1.name2);
//弹出值是什么

五、

var obj1 = { name2: "111" };
var obj2 = obj1;
obj1.name2 = "222";
alert(obj2.name2);//这里弹出什么?
obj1 = { name2: "333" };
alert(obj2.name2);//这里弹出什么?

六、

var fun = function (num1) {
     if (num1 <= 1) {
         return 1;
     }
     else {
         return num1 * fun(num1 - 1);
     }
 }
 var fun2 = fun;
 fun = function () {
     return 1;
 }
 alert(fun2(5));//这里弹出什么?

还有点时间在给大家介绍 JavaScript基本数据类型

  JavaScript的基本数据类型包括6种:number/string/boolean/object/function/undefined。

  2.1 number类型

  number类型用来存储数值,它描述的是64位的浮点型数值。但Javascript并不能表示0-2e64之间的所有数值,因为它还需要表示非整数,包括复数、分数等。对于64位来说,需要使用11位来存储数字的小数部分,使用1位来表示正负,所以JavaScript实际上可以表示-2e52到2e52之间的值。

  2.2 string类型

  string类型用来表示文本,可以使用单引号或者双引号来包括文本,任何放在引号内的符号,都会被认为是string,但对于特殊符号,可能需要转义处理。

  2.3 boolean类型

  boolean类型只包括两个值:true和false。我们可以在程序中使用各种boolean表达式来得到true或者false,从而实现不同的业务分支处理。

  我们可以在表达式中包含多个条件,条件之间可以是与或非的关系,在计算时,优先级如下:||的优先级最低,其次是&&,然后是比较运算符,最后是其他运算符(例如!)。

  和其他许多语言一样,对于&&来说,当前面的条件为false时,后面的条件不再计算,对于||来说,当前面的条件为true时,后面的条件不再计算。

  来看下面的例子:

function conditionTest(){
   var a = ;
   var b = ;
   var c = {"key":"old"};
   print(c["key"]);
   if (a==) print("a = ");
   if (a== && b==) print("a == && b == ");
   if (a== || changeValue(c)) print(c["key"]);
   if (a== && changeValue(c)) print(c["key"]);
 }
 function changeValue(obj){
   obj["key"] = "changed";
   return true;
 }

  它的输出结果如下:

old
a = 1
a == 1 && b == 1
old
changed

  可以看出,在使用||时,没有调用changeValue方法。

  2.4 undefined类型

  当我们声明了一个变量,但是没有对其赋值时,它就是undefined的,就像下面这样

var b;
 print(b);

  在Javascript中,还有一个和undefined类似的值:null。undefined表示“变量已声明但是没有复制”,null表示“变量已赋值但为空”,需要注意的是undefined==null的值为true。

  2.5 类型转换

  我们在上面提到了undefined == null的值是true,但我们使用typeof操作时可以发现,null是object类型,这说明在比较的过程中,发生了类型转换。

  类型转换是指将一种类型的值转换成另外一种类型的值。我们使用==进行比较时,会有类型转换,我们可以使用===来禁止类型转换。

  来看下面的例子:

function convertTypeTest(){
   var a = ;
   var b = "";
   print ("a:" + a);
   print ("b:" + b);
   print ("type of a:" + typeof a);
   print ("type of b:" + typeof b);
   print ("a==b:" + (a == b));
   print ("a===b:" + (a === b));
   print ("a===Number(b):" + (a === Number(b)));
   print ("String(a)===b:" + (String(a) === b));
   print ("type of undefined:" + typeof undefined);
   print ("type of null:" + typeof null);
   print ("undefined==null:" + (undefined == null));
   print ("undefined===null:" + (undefined === null));
 }

  输出结果如下:

a:1
b:1
type of a:number
type of b:string
a==b:true
a===b:false
a===Number(b):true
String(a)===b:true
type of undefined:undefined
type of null:object
undefined==null:true
undefined===null:false

可以很明显看到==和===的区别。

(0)

相关推荐

  • JavaScript的作用域和块级作用域概念理解

    作用域永远都是任何一门编程语言中的重中之重,因为它控制着变量与参数的可见性与生命周期.讲到这里,首先理解两个概念:块级作用域与函数作用域. 什么是块级作用域呢? 任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域. 函数作用域就好理解了(*^__^*) ,定义在函数中的参数和变量在函数外部是不可见的. 大多数类C语言都拥有块级作用域,JS却没有.请看下文demo: //C语言 #include <stdio.h> void mai

  • JavaScript 基本概念

    一.区分大小写 在ECMAScript中的一切(变量.函数名.操作符)都是区分大小写的. 如变量名test和Test分别表示两个不同的变量, 二.标识符 所谓标识符,就是指变量.函数.属性的名字,或者函数的参数.标识符按照下列格式规则组合起来的一或者多个字符: 第一个字符必须为一个字母.下划线(_).或者一个美元符号($); 其它字符可以是字母.下划线.美元符号或数字. ECMAScript标识符采用驼峰大小写格式,也就是第一个字母小写,剩下的每个单词的首字母大写,例如:firstSecond,

  • javascript,jquery闭包概念分析

    但javascript我是经常要用,所以是要懂这里面的概念. 其实javascript里的闭包概念很简单,就是函数用到外部变量,不需要传参就可以获取. 举个例子: 复制代码 代码如下: <script> var sMessage = "Hello world"; function sayHello(){ alert(sMessage); } sayHello(); addNumber(1,2); var iBaseNum = 10; function addNumber(i

  • javascript学习笔记(二) js一些基本概念

    1.typeof 操作符:用于检测给定变量的数据类型 复制代码 代码如下: var message="some string"; alert(typeof message); //"string" alert(typeof(message)); //"string" alert(typeof 100); //"number" typeof操作符可能返回下列字符串: "undefined","boo

  • 深入理解JavaScript编程中的原型概念

    JavaScript 的原型对象总是让人纠结.即使是经验丰富的JavaScript专家甚至其作者,经常对这一概念给出很有限的解释.我相信问题来自于我们对原型最早的认识.原型总是与new, constructor 以及令人困惑的prototype属性紧密联系.事实上,原型是一个相当简单的概念.为了更好地理解它,我们需要忘记我们所'学到'的构造原型,然后,追本溯源. 什么是原型? 原型是一个从其他对象继承属性的对象. 是不是任何对象都可以是原型? 是的 那些对象有原型? 每个对象都有一个默认的原型.

  • javascript相关事件的几个概念

    客户端javascript程序采用了异步事件驱动编程模型. 相关事件的几个概念: 事件类型(event type):用来说明发生什么类型事件的字符串: 事件目标(event target):发生事件的对象: 事件处理程序(event handler):处理或响应事件的函数: 事件对象(event object):与特定事件相关且包含有关该事件详细信息的对象: 事件传播(event propagation):浏览器决定哪个对象出发其事件处理程序的过程: 注册事件处理程序: 1.设置javascri

  • 通过实例理解javascript中没有函数重载的概念

    将函数名想象为指针,也有助于理解为什么ECMAScript中没有函数重载的概念.如下例子: 复制代码 代码如下: function addSomeNum(num) {     return num+100; } function addSomeNum(num) {     return num+200; } var result=addSomeNum(100);//300 显然,这个例子中声明了两个同名函数,而结果则是后面的函数覆盖了前面的函数.以上代码实际上与下面的代码是一致的. 复制代码 代

  • JavaScript基本概念初级讲解论坛贴的学习记录

    1.关于this对象 复制代码 代码如下: view plaincopy to clipboardprint? var obj1=new Object(); var obj2=new Object(); //给两个对象都添加属性p,并分别等于1和2 obj1.p=1; obj2.p=2; //给obj1添加方法,用于显示p的值 obj1.getP=function(){ alert(this.p); //表面上this指针指向的是obj1 } //调用obj1的getP方法,结果显示为1 obj

  • JavaScript内核之基本概念

    本章主要讲述JavaScript中的数据类型(基本类型与引用类型),变量(包括变量的作用域),操作符(主要是一些较为常见,但是不容易从字面上理解的操作符).由于JavaScript中的"一切皆对象",在掌握了这些基本的概念之后,读者就可以较为轻松的理解诸如作用域,调用对象,闭包,currying等等较难理解的概念了. 数据类型 有程序设计经验的读者肯定知道,在C或者Java这样的语言中,数据是有类型的,比如用以表示用户名的属性是字符串,而一个雇员的年龄则是一个数字,表示UI上的一个开关

  • javascript中几个容易混淆的概念总结

    1. var name = "The Window"; var object = { name : "My Object", getName: function(){ return this.name; } }; 这里的getName()方法只简单地返回this.name 的值.以下是几种调用object.getName()的 方式以及各自的结果. object.getName(); //"My Object" (object.getName)(

  • 深入剖析JavaScript编程中的对象概念

    JavaScript 中的所有事物都是对象:字符串.数值.数组.函数... 此外,JavaScript 允许自定义对象. 所有事物都是对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 布尔型可以是一个对象 数字型可以是一个对象 字符串也可以是一个对象 日期是一个对象 数学和正则表达式也是对象 数组是一个对象 甚至函数也可以是对象 JavaScript 对象 对象只是一种特殊的数据.对象拥有属性和方法. 访问对象

  • JavaScript回调(callback)函数概念自我理解及示例

    此文适合JavaScript入门级选手阅读,高手就可以飘过了. 先扯点闲话.在中国,有这么一种现象:不管什么词或者概念,总会有些人把这些东西解释的神乎其神,貌似搞得别人听不懂就觉得自己很厉害的样子.其实不知道有多2.我个人比较崇尚简洁明了.什么词,什么概念,如果你能用简短的一两句话让大家听明白,这才是本事.好了,闲话不扯了,进入正题. 在JavaScript里什么叫Callback"回调函数",用我的话来讲就是把方法b当做一个参数传递个方法a,当方法a执行完后执行另外一个指定函数(这里

随机推荐