JavaScript基础入门教程(二)

说明

  前一篇博客介绍了js以及一些关于js基本类型的简单知识,本篇博客将详细介绍js的基础类型,捎带介绍对象类型,更详细的对象类型的说明将后续再讲。

js中类型的说明

  js中的类型分为基本类型和对象类型,其中基本类型包括:①数字、②字符串、③布尔值。此外还有两个原始值null和undefined。其中对象包括数组对象、函数对象和普通对象,普通对象是“命名值”的无序集合,而数组对象是带编号的值的有序集合。JavaScript核心还定义了三种有用的类:日期(Data)类、正则(RegExp)类、错误(Error)类。

数字

  和常见的其它编程语言不同,js不区分整数和浮点数,js中所有的数值均用浮点数值表示。

整型直接量

  在js中一个数字序列默认是十进制的整数,同时支持使用"0x"或"0X"开头的十六进制,值得注意的是虽然有些JavaScript解释器支持0开头的八进制表示形式,但是ECMAScript标准并不支持,所以尽量不要使用八进制表示形式,以免出现移植上的问题。

浮点型直接量

  浮点型直接量的表示形式为:[digits][.digits][(E|e)[(+|-)]digits],例如①3.14、②6.02e23、③.22e-23 //0.22x10-23

js中的算术运算

  js不仅支持常见的加(+)减(-)乘(*)除(/)和求余(%),还支持更复杂的运算,不过需要Math对象的支持:

js语句 作用
Math.pow(2,53) 求2的53次幂
Math.round(0.6) 四舍五入,结果为1.0
Math.max(x,y,z) 求最大值
Math.PI 返回圆周率π的值

  js的算术运算会出现上溢和下溢,这与其它语言稍有区别,上溢的结果为Infinity或-Infinity,下溢的结果为0或-0,一般0和-0没什么区别(0===-0结果为true),但有时候还是会有不同,比如1/0结果为Infinity,而1/-0结果为-Infinity。此外还有一个结果就是NaN(Not a Number),当出现结果不是数字或者无法将其转化为数字时用NaN表示,比如负数开方、零除以零、无穷大除以无穷大等操作。

  全局函数isNaN()和全局函数isFinity()可以用于判断数值的类型,当一个数是NaN时isNaN()函数返回true,当一个数不是NaN、Infinity或-Infinity时isFinity()返回true。

二进制浮点数的四舍五入错误

  看下面的代码:

1 var x = .3 - .2;
2 var y = .2 - .1;
3 x == y    //false
4 x == .1    //false
5 y == .1    //true

  造成这种结果的原因是因为二进制浮点数的表示是近似表示,值得注意的是这种问题不仅在js中会出现,在其它所有利用浮点数计算的语言中都会存在。为了更好的解决这种问题可以将自己要算的数同时扩大一个倍数,看下面的代码:

1 var x = 3 - 2;
2 var y = 2 - 1;
3 x == y;    //true

日期和时间

  Date是js的语言核心的一部分,这里简单介绍Date的一些简单用法,更详细的介绍将在后续的博客中介绍。

1 var now = new Date();    //获取当前时间
2 var then = new Date(2011,0,1);    //2011年1月1号
3 var later = new Date(2011,0,1,17,10,30)    //2011年1月1号17时10分30秒
4 var elapsed = now - then;    //结果为时间间隔的毫秒数
5 later.getFullYear();    //2011
6 later.getMonth();    //0:月份计数从0开始
7 later.getDate();    //1:每月的日期计数从1开始
8 later.getDay();    //6:0代表星期日,6代表星期六

文本

  说起字符串,就需要谈到编码方式了,js采用UTF-16的Unicode编码,这样以来处于“基本多语种平面”的字符都是两个字节,而处于“辅助多语种平面”的字符是四个字节。这意味在js中长度为2的字符串可能有两个字符,也可能只有一个字符。

1 var p = "π";
2 var e = "??";//"\ud835\udc52"
3 p.length    //1
4 e.length    //2

  需要注意一点,js中定义的各种函数操作全部是针对“基本多语种平面"的,所以在处理字符串时需要当心。

字符串直接量

  字符串直接量可以使用单引号或双引号括起来,在ECMAScript3中,字符串直接量必须写在一行中,而在ECMAScript5中,字符串直接量可以拆分成数行,但是每一行的结尾必须是反斜杠(\)。

1 "Wouldn‘t you prefer D‘Reilly‘s book?"
2 "one 3 long 4 line"    //ECMAScript5

  因为js和html都支持单引号和双引号来括起内容,所以一般分别用不同的引号来括起各自的内容:

1 <bytton onclick="alert(‘hello world‘)">click me</button>

字符串的使用

  和java一样,js支持字符串使用加号进行拼接,字符串"hello, "+"world"等价于"hello, world"。要确定一个字符串的长度可以使用其length属性,此外js的字符串还有许多方法可供调用:

 1 var s="hello, world";
 2 var len=s.length;
 3 s.charAt(0)    //h:第一个字符
 4 s.charAt(s.length-1)    //d:最后一个字符
 5 s.substring(1,4)    //ell:第2-4个字符
 6 s.slice(1,4)    //ell:同上
 7 s.slice(-3)    //rld:最后三个字符
 8 s.indexOf("l")    //2:字符l第一次出现的位置
 9 s.lastIndexOf("l")    //10:字符l最后出现的位置
10 s.indexOf("l",3)    //3:在位置3及其之后,字符l第一次出现的位置
11 s.split(", ")    //["hello","world"]:根据", "将字符串分割成子串存在数组中。
12 s.replace("h","H")    //"Hello, world":替换全文中所有的h为H
13 s.toUpperCase()    //"HELLO, WORLD

  此外字符串的引用还有下标法,也就是说s.charAt(0)等价于s[0]。和java一样,JavaScript 的字符串是不可变的(immutable),String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法,返回的是全新的字符串,而不是修改原始字符串。

布尔值

在条件判断时以下值会转化为false,其它所有情况将转化为true,包括数组、函数、对象等。值得注意的是,虽然0将转化为false,但是"0"还是转化为true。

1 undefined
2 null
3 0
4 -0
5 NaN
6 ""  //空字符串

null和undefined

  尽管null和undefined不尽相同,但是他们也经常可以互换。比如null==undefined的结果就为true(可以使用===严格等于判断null和undefined不等)。一般来说null和undefined的区别就是null是存在但空缺值,而undefined是不存在。比如某个变量被定义了,但是没值一般是null,但是如果是某个对象根本不存在length这个属性,而我们强行使用他的length属性就会返回undefined。

包装对象

  学到现在你可能好奇过为什么js中的基本数据类型也有属性,比如下面的代码,虽然s是字符串类型,但它依然有属性。学过java的部分同学可能纠结string不应该是Object类型的一种吗?这里的回答是“不”,在js中string是一种独立的基本类型,而String才是Object类型的一种。

1 var s="hello, world"
2 var world=s.substring(s.indexOf("w"), s.length);

  之所以会产生上面的效果,究其根本就是js的包装类型造成的。js解释器会在变量的每次使用时将一个基本类型转化为一个临时的对应的包装类的类型,比如上面的s在使用它的length属性时,js解释器会自动执行类似temp=new String(s); temp.length;的操作来替代刚才那句话。同字符串一样,数字和布尔值也都有对应的包装类类型的构造函数,分别是Number()和Boolean()。null和undefined都没有包装类,访问它们属性都将报错。

  在判等时,==运算符会判定值相同的基本类型和其对应的包装类型相等,而===则判定不等。

可变对象的引用

  对象和原始值不同,首先它们时可变的——它们的值是可修改的:

1 var o={x:1};    //定义一个对象
2 o.x=2;            //通过修改对象属性值来更改对象
3 o.y=3;            //再次更改这个对象,给它增加一个新属性
4
5 var a=[1,2,3];    //数组也是可以修改的
6 a[0]=0;            //更改数组的一个元素
7 a[3]=4;            //给数组新增一个元素

  数组和对象类型的比较是引用比较,这个和java语言相似,两个对象即使类型相同并且属性值也相同,它们还是不等。只有两个引用指向同一个对象,这两个引用才相等。

类型转换

  由于js的弱类型,所以js解释器本身会自动进行大量的隐式转换,如果期望一个布尔值,js会把给定的值转化为布尔值,转化规则见上面,同理如果期望字符串,js会自动把给定的值转化为字符串类型,如果期望数字,它也会自动把值转化为数字(如果转化结果没有意义将得到NaN)。

接下来的关于类型转换的东西,个人觉得这篇博客比《JavaScript权威指南》讲的要好一点。

原文地址:https://www.cnblogs.com/flyor/p/8466261.html

时间: 2024-10-11 05:47:11

JavaScript基础入门教程(二)的相关文章

JavaScript基础入门教程(四)

说明 前面三篇博客介绍了js中基本的知识点,包括变量类型及其转换.表达式.运算符等小知识点,这篇博客主要讲的是对象.如果你学过java等语言,你也许在下文的阅读中发现在js中的对象与java中的对象存在一定的区别. 相关术语说明 一.对象中成员变量的"属性特性" ①可写:表明该属性可以设置其值. ②可枚举:表明是否可以通过for/in循环返回该属性. ③可配置:表明是否可以删除或者修改该属性. 注:关于for/in等语句的说明,第一篇博文就说过,本系列教程是建立在读者对基本的编程有一定

JavaScript基础入门教程(三)

说明 前面的两篇博客介绍了js中的基本知识中的变量类型.标识符等.这篇博客主要谈表达式以及运算符. 原始表达式 原始表达式就是表达式中最小的,不能在分割的表达式,一般指变量.常数直接量.关键字(true.false.null.this),这里需要注意的是undefined是一个全局变量,而不是关键字. 对象和数组的初始化表达式 数组初始化表达式是一个方括号,中间放置数组中的元素,元素间用逗号分割.元素可以是表达式.数组.空. 1 [] //一个空数组,数组里面没有元素 2 [1+2,3+4] /

JavaScript基础入门教程(一)

js的数据类型 虽然js属于弱类型语言,但其总共有6种数据类型.弱类型的意思是定义的变量没有类型的区分,比如先执行 var num=123; 定义了一变量num存储整数,可接下来执行 num="hello world"; 将字符串赋值给num变量并不会报错,是合法的. js的弱类型相对于强类型的语言来说看起来好像很好用,其实也不尽然,下面列举了一些字符串和整数进行操作时候的一些因为js的弱类型带来的问题. 32 + 32 // 结果是 64 "32" + 32 //

2015年最新Android基础入门教程目录(完结版)

2015年最新Android基础入门教程目录(完结版) 标签(空格分隔): Android基础入门教程 前言: 关于<2015年最新Android基础入门教程目录>终于在今天落下了帷幕,全套教程 共148节已编写完毕,附上目录,关于教程的由来,笔者的情况和自学心得,资源分享 以及一些疑问等可戳:<2015最新Android基础入门教程>完结散花~ 下面是本系列教程的完整目录: 第一章:环境搭建与开发相关(已完结 10/10) Android基础入门教程--1.1 背景相关与系统架构

Android基础入门教程——8.3.11 Paint API之—— ColorFilter(颜色过滤器)(3-3)

Android基础入门教程--8.3.11 Paint API之-- ColorFilter(颜色过滤器)(3-3) 标签(空格分隔): Android基础入门教程 本节引言: 嗯,本来说好今天不写的,还是写吧,毕竟难得空闲哈~,本节给大家带来的是 ColorFilter的第三个子类:PorterDuffColorFilter,看到PorterDuff大家一定不会 陌生吧,假如你看过前面的 Android基础入门教程--8.3.5 Paint API之-- Xfermode与PorterDuff

Android基础入门教程——8.3.4 Paint API之—— Xfermode与PorterDuff详解(一)

Android基础入门教程--8.3.4 Paint API之-- Xfermode与PorterDuff详解(一) 标签(空格分隔): Android基础入门教程 本节引言: 不知道标题这两个玩意你熟不熟悉啦,如果自己实现过圆角或者圆形图片,相信对这两个名词 并不模式,一时半伙没想起来?没关系,下面这个图你可曾见过? PS:网上都说在:\samples\android-XX\legacy\ApiDemos\src\com\example\android\apis\graphics 下能找到这个

Android基础入门教程——1.2 开发环境搭建

Android基础入门教程--1.2 开发环境搭建 现在主流的Android开发环境有: ①Eclipse + ADT + SDK ②Android Studio + SDK ③IntelliJ IDEA + SDK 现在国内大部分开发人员还是使用的Eclipse,而谷歌宣布不再更新ADT后,并且官网也去掉了集成Android开发环境的Eclipse下载链接,各种现象都表示开发者最后都终将过渡到Android Studio,当然这段过渡时间会很长,但如果你是刚学Android的话建议直接冲And

Android基础入门教程——8.3.7 Paint API之—— Xfermode与PorterDuff详解(四)

Android基础入门教程--8.3.7 Paint API之-- Xfermode与PorterDuff详解(四) 标签(空格分隔): Android基础入门教程 本节引言: 上节我们写了关于Xfermode与PorterDuff使用的第一个例子:圆角&圆形图片ImageView的实现, 我们体会到了PorterDuff.Mode.DST_IN给我们带来的好处,本节我们继续来写例子练练手, 还记得Android基础入门教程--8.3.2 绘图类实战示例给大家带来的拔掉美女衣服的实现吗? 当时我

Android基础入门教程——4.1.2 Activity初窥门径

Android基础入门教程--4.1.2 Activity初窥门径 标签(空格分隔): Android基础入门教程 本节引言: 上一节中我们对Activity一些基本的概念进行了了解,什么是Activity,Activity的生命周期,如何去启动一个Activity等,本节我们继续来学习Activity,前面也讲了一个App一般都是又多个Activity构成的,这就涉及到了多个Activity间数据传递的问题了,那么本节继续学习Activity的使用!另外关于传递集合,对象,数组,Bitmap的