一步步学习javascript基础篇(1):基本概念
2015-11-23 09:18
561 查看
一、数据类型
数据类型
基本数据类型(五种)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));//这里弹出什么?
有兴趣的同学可以思考或者翻阅资料。
这是学习记录,不是教程。文中错误难免,您可以指出错误,但请不要言辞刻薄。
原文链接:http://haojima.net/zhaopei/511.html
本文已同步至目录索引:一步步学习javascript
欢迎上海“程序猿/媛”、"攻城狮"入群:【沪猿】229082941 入群须知
相关文章推荐
- JavaScript中的正则表达式使用及验证qq号码的正则
- 浅谈tab选项卡制作思想
- JS 页面跳转常用代码
- 常规功能和模块自定义系统 (cfcmms)—020自定义grid方案(4改成任意层表头)
- Mac下为SublimeText安装与配置HTML CSS JS 格式化插件-超级好用,步骤100%验证
- ExtJS4.2学习(19)在线编辑器Ext.form.HtmlEditor(转)
- Ember.js 入门指南——总目录
- ExtJS4.2学习(17)表单基本输入控件Ext.form.Field(转)
- ExtJS4.2学习(16)制作表单(转)
- JSON方法
- BZOJ1444 : [Jsoi2009]有趣的游戏
- three.js 入门(创建模型的必要因素)
- jsp实现将信息放入xml中的方法
- JavaScript中的正则表达式使用及验证qq号码的正则
- JavaScript高级教程5.6之基本包装类型(详细)
- javascript实现uploadify上传格式以及个数限制
- 跟我学习javascript解决异步编程异常方案
- 跟我学习javascript的垃圾回收机制与内存管理
- js实现接收表单的值并将值拼在表单action后面的方法
- JavaScript与HTML的结合方法详解