JavaScript——驰骋网页的脚本执行者(1)

一、关于JavaScript

JavaScript诞生的初衷,是为了减轻网站中表单验证部分对后台服务器和用户双方造成的负担,使一些基础数据检验在前台页面就能够完成,而不用浪费后台服务器资源,同时也减轻了后台验证时返回的页面跳转动作带来的网络负担。

JavaScript最初的名字叫LiveScript,后来为了搭上媒体上热炒的java顺风车(蹭热度),在正式发布前夕改名为JavaScript。由于浏览器厂商对脚本控制的不同实现方式,当时的JavaScript有着不同的版本,但在欧洲计算机制造商协会ECMA定义了ECMAScript标准后,各浏览器厂商就致力于将ECMAScript作为各自实现JavaScript的基础。

JavaScript由三部分组成:ECMAScript(JavaScript语法标准)、DOM(文档对象模型,可以理解为JS操作HTML)、BOM(浏览器对象模型,可以理解为JS操作浏览器)。

所有主流浏览器中都具备着JS解释器,用于解释执行JavaScript脚本。Google公司的v8引擎JavaScript解释器后来发展成为了nodeJS,nodeJS使得JavaScript代码不仅可以运行在浏览器端,还可以运行在服务器端,让JavaScript具备了编程语言的能力。JavaScript运行在浏览器端能做的有动画,表单验证,ajax数据交互等等,而运行在服务器端能做的有JS转换,代码编译,操作数据库,操作流,网络编程,ioT(物联网)等等。

二、JavaScript变量

JavaScript变量的数据类型取决于值的类型,属于一种弱类型语言(变量的数据类型取决于变量声明的属于强类型语言),并且可以随值类型的改变而改变变量类型。

JavaScript的基本数据类型有:number(各种进制表示的数字类型)、string(字符串类型)、boolean(布尔类型)、null(空对象类型)和undefined(未定义类型)。NaN、Infinity分别表示非数字和无穷值。

“typeof 变量”表达式可以得到字符串表示的变量类型名;“isNaN(变量)”表达式可以判断出变量是否不是number(数字类型);“isFinite(变量)”表达式可以判断变量是否为有穷数(JavaScript认为0出现在除运算中时表示无穷小的数,因而结果可能出现无穷数)。

虽然顺序执行是JavaScript的语言特性,但JavaScript会在执行前先提取出全文声明的变量,使得下文才声明的变量在上文就可以使用,只是变量类型为undefined,但如果使用全文都未声明过的变量则会报错。

JavaScript的引用数据类型有:数组类型、函数类型和对象类型。

基本数据类型的值保存在栈区;引用数据类型的引用地址保存在栈区,其内容保存在堆区。

三、JavaScript操作符与类型转换

1.算术运算符(略)

 

2.一元运算符

递增减运算符,如:

++代表自增,--代表自减。当它们前置于数时表示该数先自增、自减再参与其它运算;当它们后置于数时表示该数先参与其它运算,再自增、自减,如:

var a = 3;

var b = 1;

var result = ++a+b++;

++a; //a = 4;

a+b //result = 5;

b++ //b = 2;

+代表加,也代表正数,还可以将其他数据类型转换为数字类型,如:

+true //1

+‘11‘ //11

-代表减,也代表负数,还可以将其他数据类型转换为数字类型,如

-(-true) //1

-(-‘11‘) //11

3.赋值和比较运算符

“=”是赋值运算符,将等号右边的值赋给等号左边。“==”表示两边的值相等,“===”表示两边的数据类型和值都相等,“!==”表示两边的数据类型不等但值相等,常用于判断。

4.逻辑运算符(短路运算符部分)

(1)“&&”表示逻辑与,当第一个表达式为假的时候,不再计算第二个表达式,整个表达式的结果由第一个表达式来决定,此时会返回第一个表达式的运算结果,即如果第一个操作数是false,null,undefined,NaN,0或者""(在布尔类型中表示false),结果会返回该值;如果第一个数是其它,结果会返回第二个数。如:

var s1 = 8;

var s2 = "briup";

var s3 = "";

var result = s3 && s2; //””空字符串

var result2 = s1 && s2; //briup

(2)“||”表示逻辑或,当第一个表达式为真的时候,整个表达式的结果就为真,不再计算第二个表达式,此时会返回第一个表达式,即如果第一个操作数不是false,null,undefined,NaN,0或者"",结果会返回该值;如果第一个操作数是null,NaN,undefined,false,0或者"",结果会返回第二个操作数。

(3)“!”表示非,该操作符应用于任何类型的数值都返回一个布尔类型的值,它会先将任意类型的数值转换为Boolean,然后取反,如:

!a //等价于!Boolean(a),a为非0的number时返回false

!0 //true

!"" //true

!NaN //true

!false //true

连用两次逻辑非 ,就可以将任意数据类型转化为Boolean类型

!!a //等价于Boolean(a),a为非0的number时返回true

!!"" //false

5.三目运算符(“?”与“:”的组合)

variable = boolean_expression ? true_value : false_value;

如果boolean_expression为true,则将true_value赋给variable,否则将false_value赋给variable。

6.使用“+”运算的几种情况(以m+n为例)

当m,n不为String,Object类型的时候,先将m,n转换为Number类型,然后再进行计算,如:

true + false; //1;number(true)+number(false);

true + 1; //2;number(true) + 1

null + undefined; //NaN;number(undefined) + number(NaN)

当m,n有一个为String,无论另一个操作数为非对象的其它类型时,都要转换为String,然后再进行字符串拼接运算,如:

"1" + true; // 1true

"1" + undefined; // 1undefined

"1" + 1; // 11

当m,n 有一个为对象,如果该对象既重写toString,又重写了valueOf方法,就会先调用valueOf方法获取返回值,将该返回值和另外一个操作数进行运算。如果该对象没有重写valueOf方法,将调用toString方法获取返回值(字符串),将该返回值和另外一个操作数进行运算(字符串拼接),如:

var o = {

name:"briup",

valueOf:function()

return "1";

}

}

o+1; //2;(1+1)

7.类型转换小结

(1)其他数据类型转换为number主要通过Number()函数、parseInt()函数、parseFloat()函数这三种形式。

通过Number()函数转化,例如:

如果转换的值是null,undefined,boolean,number

Number(true); //1

Number(false); //0

Number(null); //0

Number(undefined); //NaN

Number(10); //10(如果是数字值则原样输出)

如果转换的值是string

Number("123"); //123;如果仅包含数值,转换为对应的数值

Number("234.1"); //234.1;解析为对应的小数

Number("+12.1"); //12.1;首位为符号位,其余为为数值,转换为对应的数值

Number("1+2.3"); //符号位出现在其他位置,解析为NaN

Number("0xa"); //10;如果仅包含十六进制格式,转为为对应的十进制的值

Number("010"); //【注意!】不会当做八进制被解析,结果为10

Number(""); //空字符串被转换为0

Number("123ac"); //包含其他字符,解析为NaN

Number(" 12"); //12

通过parseInt()函数转化,例如:

如果转换的值是null,undefined,boolean,均转换为NaN

如果转换的值是Number

parseInt(10); //10;如果是整数值,原样输出

parseInt(10.3); //10;如果是小数,舍去小数点一级后面的内容

如果转换的值是string

parseInt("123");   //123;如果仅包含数值,转换为对应的数值

parseInt("234.1"); //234;小数点后面的数值省略

parseInt("+12.1"); //12;首位为符号位,其余为为数值,转换为整数

parseInt("1+2.3"); //1;符号位出现在其他位置,保留符号位前面的数值

parseInt("0xa"); //10;如果仅包含十六进制格式,转为为对应的十进制的值

parseInt("010"); //【注意!】不会当做八进制被解析,结果为10

parseInt(""); //空字符串被转换为NaN

parseInt("1+2.3"); //1;如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为number返回

parseInt("123ac"); //123;

通过parseInt()函数转化,例如:

如果转换的值是null,undefined,boolean,均转换为NaN

如果转换的值是Number

parseFloat(10); //10;如果是整数值,原样输出

parseFloat(10.1); //10.1;如果是小数,保留小数点,但如果是10.0,结果为10

如果转换的值是string

parseFloat("123"); //123;如果仅包含数值,转换为对应的数值

parseFloat("234.1"); //234.1;保留小数点后面的数值

parseFloat("+12.1"); //12;首位为符号位,其余为为数值,转换为整数

parseFloat(“1+2.3”); //1;符号位出现在其他位置,保留符号位前的数值

parseFloat(“0xa”); //【注意!】不会当做十六进制来解析,结果为0

parseFloat("010"); //【注意!】不会当做八进制被解析,结果为10

parseFloat(""); //空字符串被转换为NaN

parseFloat("1+2.3"); //1;如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为number返回

parseFloat("123ac"); //123;

(2)除了null,undefined,其他三种基本数据类型的变量均有一个toString()函数,该函数可以获取该变量指定值的字符串表示,通常使用它来将其它类型转换为string类型,例如:

var a = true;

a.toString(); //"true"

如果变量为number类型,默认情况下toString()是以十进制格式返回数值的字符串表示,通过传递参数,可以输入以二进制,八进制,十六进制乃至任意有效进制格式的字符串值,例如:

var num = 10;

num.toString(); //"10”

num.toString(2); //"1010”

num.toString(8); //"12”

num.toString(16); //"a”

String()函数则可以将其他任意基本数据类型的值转换为字符串,包括null,undefined。

(3)任意其他数据类型都可以转换为布尔类型,转换参照下表:

原文地址:https://www.cnblogs.com/wodeqiyuan/p/11408503.html

时间: 2024-10-31 12:36:16

JavaScript——驰骋网页的脚本执行者(1)的相关文章

JavaScript——驰骋网页的脚本执行者(3)

五.对象及函数 ECMAScript中的对象其实就是一组数据(属性)和功能(方法)的集合,是一种复杂的引用数据类型,引用数据类型的函数和数组也可以看成是一种特殊的对象. 1.对象的创建 可以使用构造函数创建对象(Object是所有对象的根对象,一个普通对象都会直接间接的继承Object),如: var person = new Object(); person.name = "briup"; person.age = 22; 也可以使用对象字面量表示法创建对象,不同的属性之间用','分

JavaScript——驰骋网页的脚本执行者(4)

六.数组 1.数组的介绍 ECMAScript数组是有序列表,是存放多个值的集合,属于引用数据类型.它的特性有: 每一项都可以保存任何类型的数据: 数组的大小是可以动态调整的: 可以访问或改变数组的length属性(数组也是一种对象,length是表示数组长度的属性,length表示数组中数组项的个数):通过设置length的值在数组末尾移除数组项,或者向数组中添加新的数组项. 2.数组的创建 使用Array构造函数创建数组,如: var arr = new Array(); var arr =

JavaScript——驰骋网页的脚本执行者(2)

四.流程控制语句 1.分支 if语句 condition表示任意表达式,该表达式求值的结果不一定是布尔类型,如果不是布尔类型,ECMAScript会调用Boolean()转换函数将这个表达式结果转换为一个布尔类型,当该值为true时,执行if代码块中的内容. if-else语句 当condition为true时,执行if代码块中的内容,否则,执行else代码块中的内容,一般情况下,如果代码块中代码只有一行,可以省略大括号. if-else if-else语句,如: if(condition1){

将JavaScript 插入网页的方法

将JavaScript 插入网页的方法 使用Javascript代码. 插入JavaScript 与在网页中插入CSS的方式相似.使用下面的代码可以在网页中插入JavaScript: ... 其中的...就是代码的内容.JavaScript的插入位置不同,效果也会有所不同,还可以像CSS一样,将JavaScript保存成一个外部文件,这些内容会在下一节讨论. 用JavaScript在网页中输出内容 JavaScript使用document.write来输出内容.例如  document.writ

html dom与javascript的关系 -我们用JavaScript对网页(HTML)进行的所有操作都是通过DOM进行的

一,什么是DOM (参考源http://www.cnblogs.com/chaogex/p/3959723.html) DOM是什么 DOM全称为The Document Object Model,应该理解为是一个规范,定义了HTML和XML文档的逻辑结构和文档操作的编程接口. 文档逻辑结构 DOM实际上是以面向对象方式描述的对象模型,它将文档建模为一个个对象,以树状的结构组织(本文称之为"文档树",树中的对象称为"节点").每个文档包含1个document节点,0

【JavaScript】网页节点的增删改查

一.基本概念 这部分也就是所谓的"HTML DOM",所谓HTML DOM也就是Web页面加载规则,是一个规则,也就是网页组成的基本公式. 也就是所有网页都必须按照:<html><body></body></html>--的规则编写,也按照这样的规则加载. 所谓的"网页节点",也叫"DOM节点"的通俗解释,例如html节点下的内容就是<html></html>之间所有内容,b

读javascript高级编程12-HTML5脚本编程

一.跨文档消息传递(XDM) 1.发送消息 postMessage(msg,domain)用于发送跨文档消息.第一个参数是要传递的消息内容,第二个参数表示接收方来自哪个域.第二个参数有助于提高安全性,如果发现域不匹配则不会进行操作. 2.接收消息 接收到消息时,会触发window对象的message事件.传递给onmessage事件处理程序的对象主要包含三个信息: data:对应postMessage()第一个参数传入的内容: origin:发送消息的文档所在域.接收到消息后,检测消息来源是非常

用JavaScript实现网页动态水印

原文:用JavaScript实现网页动态水印 1.基本原理 页面加载后,通过javascript创建页面元素div,并在div元素中创建文本节点,展示水印内容 设置div元素样式,将其zIndex设置一个较高的值,并设置透明度,实现浮在页面的水印效果 其核心逻辑如下所示 var mask_div = document.createElement('div'); mask_div.id = 'mask_div1'; mask_div.appendChild(document.createTextN

通过javascript在网页端生成zip压缩包并下载

原文:通过javascript在网页端生成zip压缩包并下载 zip.js是什么 zip.js的github项目地址:http://gildas-lormeau.github.io/zip.js/ 通过zip.js封装一个能在网页端生成zip文件的插件, 直接在网页中创建包含文件夹和文件的压缩包,也可以自定义名字并下载: 如何使用: 1:引用zip.js 2:引用jQuery; 3:并引用封装的ZipArchive.js ,(因为zip.js的api使用起来比较繁琐,所以自己封装实现了这个插件)