JavaScript 是脚本语言

HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

JS使用三种方式：
1、HTML页面内嵌JS代码（不提倡使用）
2、HTML页面中直接使用JS:
<script type="text/javascript">
JS代码
</script>
3、引用外部JS文件：
<script language="JavaScript" src="../../test.js"></script>
注意：
页面中JS代码与引用JS代码可以嵌入到HTML页面的任何位置，但位置不同会影响JS代码的执行顺序
例：如果<script> 在body前，会在加载前执行JS代码
页面中JS代码使用type="text/javascript"，引用外部JS文件使用anguage="JavaScript"
引用外部JS文件的标签<script></script>，必须成对出现，且标签内部不能有任何代码

JS中的变量：
变量的命名：
由字母数字下划线和$符组成，开头不能为数字，变量名区分大小写（变量也能以 $ 和 _ 符号开头，但是不推荐这么做）

JavaScript 语句和 JavaScript 变量都对大小写敏感。

变量命名需要符合驼峰法则:即变量开头为小写，之后每个单词首字母大写（或单词之间用下划线分隔）

JS变量声明的写法：var width = 10，或width=10，或var x,y,z；
使用var声明的变量只在当前函数作用域有效，不使用var声明的变量，默认为全局变量，整个JS文件有效
同一声明语句可以同时声明多个变量，变量之间用逗号分隔，但需要分别赋值
注意事项：
1、JS中所有变量类型声明均使用var，变量的具体数据类型取决于为变量所赋的值
2、同一变量可以在多次赋值时修改变量的数据类型
3、同一变量可以多次用var声明，但没有任何含义，不产生报错，第二次之后的声明，只会被理解为赋值

JS中的变量的数据类型：
undefined 未定义，用var声明的变量，没有进行初始化赋值
null 代表特殊变量类型，值为null，表示为空
boolean 布尔型，代表真假，值为true或false
number 数值型，可以为整数，也可为小数
string 字符串，用引号包裹的内容（包括双引号和单引号）即为字符串
object 对象类型（复杂数据类型，比如函数、数组。。）

常用的数值函数：
isNaN（）：用于判断一个变量或常量是否为非数值（NaN）
使用isNaN时会尝试使用Number（）函数进行转换，
如果能转换为数字，则不是非数值，结果为false
例："111" 纯数字字符串，会被转换为数字111
空字符串会被转换为0，true被转为1，false被转为0
当字符串中同时存在数字和其他字符时，结果为true
Number（）：将其他类型转化为数值类型
字符串类型转数值：
为纯数字字符串会转为对应数字："111"→111
为空字符串时，转为0
当包含其他非数字字符时，不能转换，提示NaN
布尔型 的true转为1，false转为0
null转为0，undefined不能转换，提示NaN
object类型 先使用valueof方法，确定函数是否有返回值，再根据上述各种情况判断
parseInt（）将字符串转为数值：
空字符串不能转换，结果为NaN
纯数值字符串，可以转换，小数转换时会直接去掉小数点，也不进行四舍五入
例："123"→123 ;"123.56"→123
包含其他字符的字符串，会截取第一个非数值字符的数值部分
例："123a456"→123 ；"a123b456"→NaN
parseInt只能转换string类型，一切非字符串（null/undefined/boolean）均不能转换，结果为NaN
parseFloat（）将字符串转为数值：
使用方式用parseInt，但转换小数字符串时，保留小数点，转换整数字符串时，直接保留整数
typeof（）用来检测变量的数据类型
未定义：undefined ；字符串：string ；true/false ：boolean ；
数值：number ；对象/null：object ；函数：function


常用的输入输出：
document.write() 文档中打印输出
输出语句，将write（）中的内容打印在浏览器中显示（打印在屏幕上）
除常量、变量以外的任何内容，打印时须放到引号内
打印的内容同时有多部分组成时，之间用+连接
例：document.write("abc"+"qwe"+ "<br/>");

document.write() 与document.writeln() 的区别：

document.write() //将内容写入文档，当前编辑位置为写入的内容的后一个字符 
document.writeln() //将内容写入文档，并添加一个换行符，当前编辑位置为写入的内容的后一行

只有在查看页面源代码的情况下才能看出来换行的情况。

说白了就是第一个写完不换行，第二个换行（输出的时候多了一个"\n"），但实际浏览器中通常把第二种输出的换行展示为空格

但放在pre标签中是不解析空白符的，所以这时的writeln在页面显示就是换行了

alert() 弹窗输出，使用方式同上。alert() 函数在 JavaScript 中并不常用，但它对于代码测试非常方便。

prompt() 弹窗输入
例：prompt("请输入内容"，"abc");
两部分参数：第一部分为输入框的提示信息，通常不省略，
第二部分为输入框的默认信息，两部分之间逗号分隔，可以定义变量接收输入内容，
例如 var name = prompt("请输入内容"，"abc");
点击确定按钮，name获得输入内容，点击取消，name=null

 JS运算符

算术运算
+ 加、- 减、* 乘、 / 除、 % 区域、++ 自增、-- 自减
+ ：两种作用，连接字符串和加法运算，
当+两边均为数字时，进行加法运算，当+两边任意一边为字符串时，进行字符串链接，连接之后的结果仍为字符串
++ 自增运算符，将变量在原有基础上加一，-- 自减运算符，即在原有基础上减一
a++ 与 ++a 的异同：
a++：先使用a的值进行计算，然后再把a加一
++a：先把a的值加一，然后用a加一后的值进行计算
不论a++ 还是 ++a ，执行完代码以后均会把a加一

赋值运算
= 赋值 += -= *= /= %=

关系运算
== 等于、===严格等于 ！=、>、<、>=、<=
===严格等于，类型不同直接返回false，类型相同再进行下一步判断
== 等于，类型相同，同=== ；类型不同，尝试将等式两边转为数字，再判断
特例：null == undefined √ null === undefined ×

条件运算符(多目运算)
a>b?true:false
有两个关键符号：？和：
当？前面的部分运算结果为true时，执行：前的代码，
当？前面的部分运算结果为false时，执行：后的代码，
多目运算符可以多层嵌套：num>5?"输入太大":(num==5 ? "蒙对了":"输入太小");

逻辑运算符
&&与、||或、！非

逗号运算符，逗号表达式：
用逗号运算符连接起来的表达式称为逗号表达式
整个逗号表达式的值是最后一个表达式的值

运算符的优先级：
() ;
! , ++ , -- ;
% , / , * ;
+ , - ;
< , > , <= , >= ;
== , != ;
&&;
||;
= , += , -= , *= , /= , %= ;

JS条件语句

if-else 结构：
if（判断条件）｛
条件为true时执行
｝else｛
条件为false时执行
｝
else可以根据具体情况省略
if()中的表达式，运算之后的结果应该为：
1、boolean：true/false
2、string：非空字符串为真，空字符串为假
3、number：除0以外均为真
4、null/undefined/NaN 均为假
5、object：均为真

多重if结构（阶梯if结构）：
if(条件1){
条件1成立
}else if(条件2){
条件1不成立且条件2成立

else if部分可以有无限多个
}else{
条件1不成立且条件也不成立
}
多重if结构中，各个判断条件是互斥的，只能选择其中一条路
if else的大括号可以省略，但不提倡，
如果省略｛｝，则if else 结构包含的代码仅为其后最近的一行（以分号结束），
如果省略｛｝，则else结构永远属于其前方最近的一个if结构

嵌套if结构
if(条件1){
条件1成立
if(条件2){
条件1成立并且条件2成立
}else{
条件1成立并且条件2不成立
}
}else{
条件1不成立
}
if结构可以多层嵌套，但原则上不超过三层，同时提倡使用多重if

switch-case 结构:
switch(){
case 常量表达式1：
语句1；
break;
case 常量表达式2：
语句2；
break;
default:
语句3；
break;
}
注意：1、switch（）中的表达式，以及每个case后面 的表达式，可以为任何JS支持的数据类型（对象和数组不行）；
2、case 后的所有复数表达式，必须各不相同，否则只会执行一个；
3、case后的常量可以是任何数据类型，同一个switch结构的不同case，可以是多种不同的数据类型
4、switch 进行判断的时候，采用的是全等判断===
5、break 的作用，执行完case语句后，跳出当前switch 结构；
缺少break的后果：从正确的case开始，依次执行所有case和default ，原因↓
6、switch 结构在判断时，只会判断一次正确答案，当遇到正确的case项后，就不会再判断后续项目，依次往下执行
7、switch结构的执行速率要快于多重if结构，在多路分支时，可以优先考虑使用switch结构。

JS循环语句

循环结构的步骤：
1、声明循环变量
2、判断循环条件
3、执行循环体操作
4、更新循环变量
然后循环执行 2、3、4步骤

JS中循环条件支持的数据类型：
1、boolean：true/false
2、string：非空字符串为真，空字符串为假
3、number：除0以外均为真
4、null/undefined/NaN 均为假
5、object：均为真

while 循环:
while(表达式){
语句；
}
特点：先判断，再执行

do whlie 循环：
do{
语句
} whlie (表达式);
特点：先执行，再判断,即使初始条件为假，也至少执行一次

for循环：
for(<定义循环变量>;<判断循环条件>;<更新循环变量>){
语句；
}
一共有三个表达式，之间用分号分隔，各个表达式都可以省略,但两个分号不可以省略
for循环特点：先判断，再执行
三个表达式均可以由多部分组成，之间以逗号分隔，但第二部分判断条件需用&&连接，最终结果需要为真/假

JS 部分基础内容总结的更多相关文章

  1. 1、js基础内容

    js基础内容 1. 编辑器 编译环境 浏览器 编辑软件 sublime DW H5Build Atom ==[注]尽可能多的去使用编辑器去编辑代码.== Html+css ==JS 逻辑== 比作建设 ...

  2. node.js学习（二）--Node.js控制台（REPL）&&Node.js的基础和语法

    1.1.2 Node.js控制台(REPL) Node.js也有自己的虚拟的运行环境:REPL. 我们可以使用它来执行任何的Node.js或者javascript代码.还可以引入模块和使用文件系统. ...

  3. Node.js系列基础学习----安装，实现Hello World, REPL

    Node.js基础学习 简介 简单的说 Node.js 就是运行在服务端的 JavaScript.Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台.Node.js是一 ...

  4. css+js+html基础知识总结

    css+js+html基础知识总结 一.CSS相关 1.css的盒子模型:IE盒子模型.标准W3C盒子模型: 2.CSS优先级机制: 选择器的优先权:!important>style(内联样式) ...

  5. JavaScript--我发现，原来你是这样的JS（基础概念--灵魂篇，一起来学js吧）

    介绍 这是红宝书(JavaScript高级程序设计 3版)的读书笔记第三篇(灵魂篇介绍),有着剩下的第三章的知识内容,当然其中还有我个人的理解.红宝书这本书可以说是难啃的,要看完不容易,挺厚的,要看懂 ...

  6. 第八节 JS运动基础

    运动基础 让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快 匀速运动(速度不变) 运动框架及应用: 运动框架: 在 ...

  7. （数据科学学习手札41）folium基础内容介绍

    一.简介 folium是js上著名的地理信息可视化库leaflet.js为Python提供的接口,通过它,我们可以通过在Python端编写代码操纵数据,来调用leaflet的相关功能,基于内建的osm ...

  8. JS零基础一步一步做应用全记录

    1.起因 作为几个外卖重度依赖癌晚期患者,呆宿舍的时候几个人一起叫外卖已经是常事.偶然看到隔壁宿舍在饿了么订餐的时候,看到在饿了么的首页上有一个谁去拿外卖的一个小游戏/工具,感觉这个小细节,饿了么把握 ...

  9. 3天学习完AngularJS基础内容小结

    简介:AngularJS 是一个 JavaScript 框架.它是一个以 JavaScript 编写的库. 一.AngularJS大致功能模块 二.页面交互变得简单 1.示例:计算价格 <htm ...

随机推荐

  1. 使用htmlparse爬虫技术爬取电影网页的全部下载链接

    昨天,我们利用webcollector爬虫技术爬取了网易云音乐17万多首歌曲,而且还包括付费的在内,如果时间允许的话,可以获取更多的音乐下来,当然,也有小伙伴留言说这样会降低国人的知识产权保护意识,诚 ...

  2. 【原创】有关Buffer使用，让你的日志类库解决IO高并发写

    [本人原创],欢迎交流和分享技术,转载请附上如下内容: 作者:itshare [转自]http://www.cnblogs.com/itshare/ 通常我们知道,当一个日志借口被外部程序多个线程请求 ...

  3. spring(二) AOP之AspectJ框架的使用

    前面讲解了spring的特性之一,IOC(控制反转),因为有了IOC,所以我们都不需要自己new对象了,想要什么,spring就给什么.而今天要学习spring的第二个重点,AOP.一篇讲解不完,所以 ...

  4. Java核心编程快速学习

    Java核心编程部分的基础学习内容就不一一介绍了,本文的重点是JAVA中相对复杂的一些概念,主体内容如下图所示. 反射reflect是理解Java语言工作原理的基础,Java编译器首先需要将我们编写的 ...

  5. Unity 3D Framework Designing(7)——IoC工厂理念先行

    一谈到 『IoC』,有经验的程序员马上会联想到控制反转,将创建对象的责任反转给工厂.IoC是依赖注入 『DI』 的核心,大名鼎鼎的Spring框架就是一个非常卓越的的控制反转.依赖注入框架.遗憾的是, ...

  6. centos5.11架设svn（svn系列 架设服务器 知识一总结）

    ♣svn是什么? ♣安装    --yum安装    --创建svn版本库目录    --创建版本库    --进入conf目录进行配置(该svn版本库配置文件)    --启动svn版本库    - ...

  7. centos 6.5 搭建JSP运行环境

    一.安装nginx yum install nginx #安装nginx,根据提示,输入Y安装即可成功安装 service nginx start #启动 chkconfig nginx on #设为 ...

  8. Async/Await替代Promise的6个理由

    译者按: Node.js的异步编程方式有效提高了应用性能:然而回调地狱却让人望而生畏,Promise让我们告别回调函数,写出更优雅的异步代码:在实践过程中,却发现Promise并不完美:技术进步是无止 ...

  9. （转）Java线程面试题 Top 50

    原文链接:http://www.importnew.com/12773.html   本文由 ImportNew - 李 广 翻译自 javarevisited.欢迎加入Java小组.转载请参见文章末 ...

  10. ArcGIS API for JavaScript 4.2学习笔记[20] 使用参数查询要素（油井和地震关系）

    这个例子相当复杂.我先简单说说这个例子是干啥的. 在UI上,提供了一个下拉框.两个滑动杆,以确定三个参数,使用这三个参数进行空间查询.这个例子就颇带空间查询的意思了. 这个例子是干嘛的呢?第一个参数是 ...