1.JS简介

• JavaScript简称JS，是前端开发的一门脚本语言(解释型语言)
  • 解释型语言：程序执行之前，不需要编译，直接运行时边解析边执行的语言
  • 编译型语言：程序执行之前，需要一个专门的编译过程，把程序编译成为机器语言的文件，比如exe文件
• 组成部分
  • ECMAScript：JavaScript的语法标准
  • DOM(Document Object Model) 通过js操作网页元素
  • BOM(Browser Object Model) 通过api操作浏览器
• 特点
  • 简单易用
  • 解释执行
    • 编译执行 java c# 转化为.dll可执行文件==>电脑读取.dll可执行文件
  • 基于对象面向过程

2.JS的书写位置

• 内嵌式

  </body>
  ... ...
  <script type="text/javascript">
      alert("hello world");
  </script>
  </body>
  

  • 通常将js代码放在body的最后, 因为HTML是从上至下加载, 而js代码通常是给标签添加交互(操作元素), 所以需要先加载HTML, 否则如果执行js代码时HTML还未被加载, 那么js代码将无法添加交互(操作元素);
  • HTML页面中出现<script>标签后，就会让页面暂停等待脚本的解析和执行。无论当前脚本是内嵌式还是外链式，页面的下载和渲染都必须停下来等待脚本的执行完成才能继续, 所以如果把js代码写在head中, 那么js代码没有执行完毕之前后续网页无法查看

• 外链式

  <script src="1.js"></script>
  

  • 外链式的script代码块中不能编写js代码, 即便写了也不会执行

  <script type="text/javascript" src="01-js书写格式.js">
  alert("hello world"); // 不会被执行
  </script>
  

• 注意

  • 写js代码的时候，分号不能省略
  • 由于每次加载外链式的js文件都会发送一次请求, 这样非常消耗性能, 所以在企业开发中推荐将多个JS文件合成为一个JS文件,以提升网页的性能和加载速度

3.JS中输出消息的几种方式

• alert() 在页面弹出一个对话框，早期JS调试使用
• Confirm() 在页面弹出一个对话框, 常配合if判断使用
• console.log() 将信息输入到控制台，用于js调试
• prompt() 弹出对话框，用于接收用户输入的信息
• document.write()在页面输出消息
  • document.write不仅能输出信息，还能输出标签。

  alert("哈哈");
  confirm("哈哈");
  console.log("哈哈");
  prompt("哈哈");
  document.write("第一行<br><strong>第二行</strong>")

3.JS的注释

• 快捷键 ctrl+/
• 单行注释 //
• 多行注释 /* */

4.变量

• 定义变量
• 给变量赋值
• 定义并赋值

var name;//定义变量
name = "李四";//给变量赋值

var name = "李四";//定义变量并且赋值

• 变量的命名规范
  • 不能以数字或者纯数字开头来定义变量名
  • 不推荐使用中文来定义变量名
  • 不能使用特殊符号或者特殊符号开头(-除外)
  • 不推荐使用关键字和保留字来定义变量名

  • 在JS中严格区分大小写的

    
    
    关键字保留字.png

5.JS中的数据类型

• 查看数据类型 typeof()

var n1 = 100;
alert(typeof(n1));

• Number 数字类型
  • 包含整数和小数

  var num1 = 100;
  var num2 = 1.05;
  alert(typeof(num1));
  alert(typeof(num2));
  

  • 数字类型的表达方式
    • 十进制
    • 十六进制(从0-9，a(A)-f(F)表示数字。以0x开头。)
    • 八进制(0开头，0-7组成。)
  • 最大小值,无穷大小值(由于内存的限制，ECMAScript 并不能保存世界上所有的数值)
    • 最大值：Number.MAX_VALUE
    • 最小值：Number.MIN_VALUE
    • 无穷大：Infinity, 如果超过了最大值就会返回该值
    • 无穷小：-Infinity, 如果超过了最小值就会返回该值
    • NaN 非法数字（Not A Number）,JS中当对数值进行计算时没有结果返回，则返回NaN
• String 字符串
  • 凡是用双引号或者单引号引起的都是字符串。

  var str1 = "哈哈";
  var str2 = '哈哈';
  alert(typeof(num1));
  alert(typeof(num2));
  

• Boolean 布尔数据类型
  • 只有2个值一个是true, 一个是false. 实际运算中true=1,false=0

  var n1 = 1;
  var n2 = 2;
  alert(typeof(n1==n2);//false
  alert(typeof(n1<n2);//true
  

• Undefined 变量未初始化
  • 定义了变量，没有给变量赋值,但变量在内存中是存在的

  var n1;
  alert(n1);
  

• Null 空值(变量未引用)
  • 在内存中是找不到这个变量的

   var n1 = null;
  

6.比较运算符

• 大于>
• 小于<
• 大等>=
• 小等<=
• 等于 ==
• 不等于 !=

7.算术运算符

• +号
  • 两个数字类型的变量相加，得到的是一个数字类型。
  • 一个数字类型和一个字符串相加，得到的是一个字符串。
• -号
  • 两个数字类型的变量相减，得到的是一个数字类型。
  • 一个数字类型和一个数字字符串相减，得到的是一个数字类型。
  • 一个数字类型和一个非数字字符串相减，得到的是NaN,是一个数字类型。
• /号
  • 两个数字类型的变量相除，得到的是一个数字类型。
  • 一个数字类型和一个数字字符串相除，得到的是一个数字类型。
  • 一个数字类型和一个非数字字符串相除，得到的是NaN,是一个数字类型。
  • 0做为除数的时候，得到结果 Infinity （无限大），是一个数字类型。
• %(取余数)

8.带操作的运算符