JavaScript概述
关于JavaScript
JavaScript(Java脚本)是一种基于对象（Object）和事件驱动（ Event Driven）的弱类型脚本语言，使用 JavaScript可以轻松的实现与HTML的互操作，并且完成丰富的页面交互效果
基于对象： 指的是程序的内部已经为用户提供好了若干个对象，用户直接使用这些对象即可。
面向对象： java属于面向对象的语言，面向对象是指用户自己定义类，对象需要用户自己产生。
JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言。
直译式： 直接编译并执行，代码不进行预编译。
脚本： 凡是不能独立执行需要依赖其他程序的，通常都叫做脚本。
HTML文件必须在浏览器里执行，JS文件必须嵌入到HTML文件里才能执行。
脚本语言： 依附于某个程序来运行，为某个程序提供服务的语言
动态类型： 声明一个变量，能够随时改变它的类型
静态类型： 声明一个变量，不能改变它的类型
弱类型： 允许变量类型的隐式转换，允许强制类型转换（编译时检查很弱）
强类型： 变量对象在编译时确定类型，不允许类型的隐式转换（编译时检查严格）
基于原型： 原型的主要作用是继承，对象之间的继承，主要是靠原型链接。
JavaScript能干什么？
Html:负责一个页面的结构（结构层）
Css:负责一个页面的样式（样式层）
JavaScript：负责与用户交互，加强用户体验（行为层）
1、网页前端开发（Javascript的老本行）js在网页前端中的作用：数据提交到服务器之前验证数据给HTML网页增加动态功能响应用户操作加强用户体验
2、移动开发 webapp
3、混合式应用网站后端开发（Node.js可以让js在后端运行）
4、插件开发（由于js跨平台这一特性，很多插件使用js进行开发，因为一次开发可以保证跨平台使用）
5、桌面开发（主要是指chrome浏览器能把js写的程序打包成桌面应用）
6、游戏开发 等等
7、视觉交互、数据交互、node.js（后台）
JavaScript特点
(1)脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
(2)基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
(3)简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和 控制的脚本语言,其设计简单紧凑。
(4)动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访 问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响 应。
(5)跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以 带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。
JS和H5的关系
页面三要素
-
结构：HTML
-
表现：CSS
-
行为：JS
H5是一种新的技术，就目前而言，我们所知的H5都是一些标签，但是有了JS之后，这些标签深层的扩展功能才得以实现。比如video标签；我们对其理解为一个简单的标签；但是实际上，video标签还有更深层次的扩展功能；
JS引入及运行
JS书写位置
1、内部引入：在html文件中直接写在script标签内部
<script type="text/javascript"> //type属性可以省略
alert('hello world');
</script>
2、标签内引入：直接写在标签内
<button onclick="alert('hello world');">按钮</button>
3、外部引入：在html文件中通过script标签引入外部js文件
<script src="test.js"></script>
注意：
1. script标签可以放在页面任何位置
2.下面这样写是错误的！！！
<script src="path:to/index.js">
document.write("hello world")
</script>
常用输出/调试方法
alert( ) 浏览器弹窗，弹出的内容就是（）括号中的内容
console.log( ) 在控制台打印相关信息
document.write( ) 向文档写入字符串、html 或 javascript代码
注意：调试代码应当从最终的产品代码中删除掉
基本语法
JavaScript大量借鉴了C类语言的语法，但JS的语法更加宽松
JavaScript中的语句以一个分号 ; 结尾
JavaScript多条语句组合的代码块，以 { 开头，以 } 结尾
JavaScript中的一切都区分大小写 (如 变量名、函数名等)
单行注释：// 注释内容不可以换行
块级/多行注释：/* 注释内容 可以换行 注释代码块 */
说明文档注释：/*** 文档说明的注释* 用在插件或方法开头* 说明参数及返回值等*/
养成良好的代码注释习惯，既方便自己也方便他人!!
标识符指变量、函数、属性或函数的参数的名字。
JavaScript关键字
关键字可用于表示控制语句的开始或结束，或用于执行特定操作等。
按照规则，关键字是语言保留的，不能用作标识符！
break do try typeofcase else
new instanceofcatch in return
varcontinue for switch whilefunction
this with defaultif throw delete ......
JavaScript保留字
保留字有可能在将来被用作关键字来使用，不能用作标识符！
abstract int short booleanexport interface
static byteextends long super charfinal
native class floatthrows const goto
privatedouble import public ......
变量的概念及使用
标识符命名规范
标识符指变量、函数、属性或函数的参数的名字
标识符命名规范：
1.第一个字符必须是字母、下划线 _ 或美元符号 $
2.其他字符可以是字母、下划线、美元符号或数字
3.不能含有空格
4.不能以关键字或保留字命名
5.命名的基本原则（非必须）：语义化，见名知意
1.驼峰命名法，userAgeNumber
2.帕斯卡命名法，UserAgeNumber
3.下划线命名法，user_age_number
4.匈牙利命名法，nUserAge，num_UserAge
变量的概念及底层原理
变量是指没有固定的值，可以改变的数；是存储信息的容器。
优点：方便使用，统一修改。
JS的变量是松散类型的，可以用来保存任何类型的数据。
JS中使用关键字 var 来声明变量：
关键字 变量名 赋值 数据
var userName = 'xiaocuo';
左值：在等号左侧，是变量名
右值：在等号右侧，是存进变量中的数据
引用变量名：document.write( userName );
var声明变量的底层原理：从本质上看，变量代表了一段可操作的内存，也可以认为变量是内存的符号化表示。
当我们使用关键字var声明一个变量的时候，解析器根据变量的数据类型分配一定大小的内存空间。程序就可以通过变量名来访问对应的内存了。
Uncaught ReferenceError: hello is not defined
未捕获 引用错误 : 报文
Uncaught SyntaxError: Unexpected token var
未捕获 语法错误 : 报文
数据类型
简单数据类型（基本类型）
简单数据类型：string、number、boolean、undefined、null
string 类型，值为字符串JS中使用双引号或单引号表示字符串var str1=‘123’;var str2=“abc”;
number 类型，值为数字JS中number类型包括整型、浮点型和非数字值
var num1 = 123;var num2 = 123.45;
NaN 即非数字值，是number类型中的一个特殊值
NaN 用于表示本来要返回一个数值的操作数，结果未能返回数值的情况（‘a’-1） (‘b’-3)
NaN有两个特点：(Not a Number)
1. 任何涉及NAN的操作都会返回NaN
2. NaN与任何值都不相等，包括它本身
isNaN() 判断值是否为NaN，返回布尔值
parseInt() 解析一个字符串，并返回一个整数
parseFloat() 解析一个字符串，并返回一个浮点数
Number.toFixed(n) 方法可把 Number 四舍五入保留n位小数，返回字符串
boolean 类型，值为布尔值
boolean类型有两个值 : true 和 false
undefined 类型，表示值未定义
undefined类型只有一个特殊值为 : undefinedvar und;声明变量未赋值，这个变量的值就是undefined
null 类型，表示空 表示一个空对象的引用null类型只有一个特殊值为 :
null如果变量准备在将来用于保存一个对象，那么该变量最好初始化为
nullconsole.log(undefined===null) ; //true 规定
console.log(undefined===null) ; //false 规定
复杂数据类型（引用类型，对象类型）
复杂数据类型：object类型
object 类型，值为对象类型JS中 { } 表示对象，[ ] 表示数组，function 表示函数
var obj1=[1,2,3];
var obj2={‘name’:‘laowang’};
var obj3=function () { };
typeof 运算符
typeof 操作符返回一个用来表示数据类型的字符串。
使用 typeof 操作符将会返回下列六个字符串之一：
“undefined”—值为定义
“boolean”—值是布尔值
“string”—值是字符串
“number”—值是数值
“object”—值是对象、数组或null （规定）
“function”—值是函数 （规定）
逗号、赋值、算术、关系、逻辑运算符
逗号运算符
使用逗号运算符可以在一条语句中执行多个操作，如：var a = 1, b = 2, c = 3;
返回整体的最后一个值
console.log( (a,b,c) );
var k = 0;
for(i=0,j=0;i<6,j<4;i++,j++){
k=i+j;
console.log(k);
}//k=6
赋值运算符**= += -= *= /= %=**
JS中的 ‘=’ 号并非数学计算中的’='号，而是赋值运算符如：a = 5，应该理解为，把5这个值，赋值给变量 a
var a = 1;a += 5 --> a = a + 5;console.log(a);
算术运算符
加 减 乘 除 余+ - \* / %
console.log(0/3);console.log(3/0);
% 取余(求模)，
5%3 即 5对3取余 或 5模3
5%3 == 2 9%3 == 0
2%7 == 2 7%4 == 3
(-2)%7 == -2 (-7)%4 == -3
2%(-7) == 2 (7)%(-4) == 3(
-2)%(-7) == -2 (-7)%(-4) == -3
a%b==c余数的正负号取决于a的符号
不考虑正负号的情况下，如果a<b,那么c=a
递增和递减运算符
++和 --
++ 表示值递增加1
-- 表示值递减减1
var i = 0;
++i 表示先递增，后取值
i++ 表示先取值，后递增
思考：var i = 4, v;v = i++;i = ++i;alert(v);alert(i);
var k = 0;console.log(k++ + ++k + k * 2 + k++);console.log(k);
关系运算符
>、 < 、==、===、 >= 、<= 、!=、 !==
关系运算符返回布尔值
等于 == 只比较值是否相等(忽略类型)
全等 === 先比较类型(内存地址)，再比较值
表达式两侧都是数值 --> 正常比较
引用类型，比较的是对象的内存地址
console.log({}=={});//false
console.log({}==={});//false
表达式两侧都是字符串 --> 正常比较(先比较第一个字符)，比较字符的ASCII码值，‘0’ – 48，‘A’ – 65，‘a’ – 97
表达式两侧有一侧是纯数字字符串，该字符串自动转成数字，再进行比较
表达式两侧有一侧是非数字字符串，不能正常比较，所有非正常比较都返回 false
三元运算符(三目运算符)：
Boolean ? express1 : express2;
var str = 3 > 4 ? 'aaa' : 'bbb';
document.write(str);
优点：代码少
缺点：不方便阅读和维护
逻辑运算符
逻辑运算符返回布尔值
&& 逻辑与，&&前后均为true才会返回true
|| 逻辑或，||前后有一个为true就会返回true
! 逻辑非，!求当前值的相反值
var res1 = true && false;
var res2 = false || true;
var res3 = !true;
短路操作
var a = 2, b = 3;
(a < b) && (a = 5);
alert(a);
var a = 4, b = 3;
(a < b) && (a = 5);
alert(a);
var a = 2, b = 3;
(a < b) || (a = 5);
alert(a);
var a = 4, b = 3;
(a < b) || (a = 5);
alert(a);
487
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
