JS的介绍与入门
JS的介绍
JS是一种运行在JS解释器或者独立引擎上的，单线程、弱类型、解释性的脚本语言。
- 单线程：同一时间内，只能做一件事。
- 弱类型：声明变量时不用强制规定变量的数据类型，只用var。
- 解释性：解释一句，执行一句，效率低但跨平台性好。
JS的引入方式
- 行内式：写在标签内的js代码 如：
<div onclick=" "> - 外链式：使用script标签的src属性来引入外部的JS文件。
- 内嵌式：写在HTML文件里面，script标签里面的JS代码。
区分外链式和内嵌式：找src属性，如果使用src属性引入，那么在src引入的script标签里面写的JS代码就不起作用。
外链式可以和内嵌式一起使用。
常用的JS代码：
- alert(" "); 在页面弹出一个提示框
- prompt(" "); 在页面弹出一个输入框
- console.log(" "); 在控制台打印数据
- confirm(" "); 弹出确认框，默认有确认取消按钮
- document.write(" "); 动态地向页面添加内容
例：
var age=prompt("你今年几岁了？");
console.log("age");
JS解释器
JS解释器就是浏览器的内核
现在的主流浏览器以及内核如下：
- IE浏览器：Trident
- chrome谷歌浏览器：Blink
- FireFox火狐浏览器：Gecko
- Opera欧朋浏览器：Blink
- Safari苹果的浏览器：Webkit
JS变量声明
变量的作用：用来存储数据
变量的初始化：变量的声明和赋值
变量声明以及代码运行原理：
例子：
var a;
a = 10;
a = 12;
var a;
-
变量声明：
var a; -
变量赋值：
a = 10; -
变量的重新赋值：
a = 12;
（1）先把内存中的原值销毁掉
（2） 把新值存入变量 -
变量的重新声明：
var a(上述例子第二个var a)
（1）先销毁掉变量在内存中开辟的空间
（2）使用var在内存中开辟新的内存空间 -
变量的批量声明和赋值，每个变量用“ ， ”（逗号）隔开，最后必须使用分号结尾:
var a=12,b=23,c=23,d=24,e=30; -
把一个变量的值赋值给另一个变量
var num1=12; var num2=num1
变量的命名规则和规范
命名规则 : 必须遵守, 不遵守程序就会报错
- 变量名使用 _ $ 或者字母开头, 变量里面可以包括 _ $ 字母 数字
- 变量必须声明后才能使用, 否则就会报错
- 不能使用js里面的关键字和保留字
命名规范 : 程序员约定俗成的一个规矩
- 最好使用英语单词来命名
- 驼峰命名法：第一个单词首字母小写，后面的单词首字母大写
如userName - 直接量：计算机可以直接识别的数据，符合JS数据类型的数据。
报错：
程序报错：1.语法错误 2.数据错误
name可以不声明使用，其他所有的变量不声明（用var声明）直接使用都会报错。
基本数据类型
计算机把不同的数据分为不同的类型
数据类型的分类：基本数据类型、复杂数据类型
-
字符串类型（String类型）：js里面一切以双引号、单引号包裹的内容就是字符串类型
注意点：
（1）在字符串里面包裹字符串，要用不同的引号
（2）不能单引号和双引号混合使用
（3）要注意区分变量名和字符串 -
数字类型 (number 类型) : 数学上一切的数字 0 1 -1 3.14
作用 : 就是用来做数学运算
Namber.Max_VALUE:最大值
Namber.Min_VALUE：最小值
Infinity：正无穷
-Infinity: 负无穷
NaN:（Not A Number）是一种特殊的数字数据类型，数学运算错误的结果 -
布尔类型（boolean类型）：true false 表示的是事物的对立面 对错
-
undefined 我们的变量声明之后 未赋值, js给变量赋的一个初始值 它是一种特殊的数据类型 他表示值为空
-
null 表示的值为空 它是一种特殊的对象 也成Null类型 必须人为的赋值给某个变量（与undefined的区别）
基本数据检测
数据类型检测 ：
（1） typeof 数据;
（2） typeof ();
typeof返回的数据有：
number、string、undefined、object、boolean、function
数据运算符
- 字符串连接符 如果 + 两边有一边是字符串, 那么他就是字符串连接符
console.log(1 + 1 + "a" + 1 + 1);
console.log(1 + 1 + "a" + (1 + 1));
- 赋值运算符 把运算符右边的值, 赋值给左边的变量
var num1 = 23;
num1 = num2;
console.log(num1);
- 算术运算符 + - * / %
console.log(1 + 1);
console.log(2 - 1);
console.log(1 * 2);
注意点 :
（1）数学里面除数不能为零 js里面也一样 如果0做了除数, 那么得到的结果是Infinity
（2） 除法会得到无理数或者无限循环小数 不影响开发
（3）尽量不要使用小数去运算 会失去精确度
（4）% 求模 取余 求除法的余数
console.log(10 % 3);
- 关系运算符
< , > , <= , >= , != , == , !== , ===
表达式 : 有运算符和操作数组成的式子 关系表达式的结果只有两种结果 布尔类型的 true false
==是比较两个数据的值是否相等 不比较数据类型
console.log(null == undefined);
console.log(3 == "3");
=== 比较两个数据的数值和数据类型是否全等
console.log(null === undefined);
console.log(3 === 3);
console.log(3 === "3");
-
逻辑运算符 && || ! 逻辑运算符是比较多个关系表达式之间的关系 逻辑运算符的结果不只是布尔类型的值
（1）逻辑与 && 一假则假表达式1 && 表达式2 结果 false true false false false false true false false（2）逻辑或 || 一真则真
表达式1 || 表达式2 结果 false true true false false false true false true true true true（3） 逻辑非 ! true变false false变true
console.log(!true); // false
console.log(!false); // true
- 复合运算符：
（1）+=：在自身基础上加多少
（2）-=：在自身基础上减多少
（3）*=：在自身基础上乘多少
（4）/=：在自身基础上除多少
（5）%=：在自身基础上模于多少
（6）++：在自身基础上加1，分为前自增和后自增
前自增：先自身加1，再运算var num=++num
后自增：先运算，再自身加1var num=num++
（7）- -：在自身基础上减1，分为前自减和后自减（原理和++一样） - 运算符的优先级：（从高到低）
（1）（）可以用来提升优先级
（2）自增自减
（3）算术运算符
（4）关系运算符
（5）逻辑运算符
（6）赋值运算符
Math
- Math.abs() 求某个数的绝对值
var num = -88;
console.log(Math.abs(num));
- Math.round() 四舍五入
var num = 5.66;
console.log(Math.round(num));
- Math.max() 求最大值
console.log( Math.max(23, 25, 42));
- Math.min() 求最小值
console.log( Math.min(23, 25, 42));
- Math.random() 生成0-1之间的随机数
var number1 = Math.random()
console.log(number1);
var number2 = Math.random() * 100 //生成0-100之间的随机数
console.log(number2);
- 底板函数 Math.floor() 向下取整
console.log(Math.floor(number1));
- 天花板函数 Math.ceil() 向上取整
console.log(Math.ceil(number1));
var num1 = -5.23;
console.log(Math.ceil(num1));
- Math.PI 常量 必须使用Math去调用
//计算圆的面积
console.log(Math.PI);
var r = 23;
console.log(Math.PI * r * r);
- Math.E 自然对数e
console.log(Math.E);
- Math.pow(x, y) 幂运算：x的y次方
console.log(Math.pow(10, 3));
//圆的面积：
var sqa = Math.PI * Math.pow(r, 2);
console.log(sqa);
- Math.sqrt() 开平方
var num=9
console.log(Math.sqrt(num));
NaN ：Not A Number
- 他是数字类型中一个特殊的值 是数学计算错误得出的结果
- NaN不等于任何数值, 包括他自己
- NaN与任何数字进行计算 得到的都是NaN
- 检测一个数据是不是NaN ： isNaN(数据)
console.log("AAA" - 1);
console.log(NaN == 0); // false
console.log(NaN == NaN); // false
console.log(typeof(NaN));
console.log(NaN + 1); // NaN
console.log(isNaN("AAA" - 1)); // true
console.log(isNaN(123)); // false
练习：
//下列哪些变量命名不符合变量命名规则 :
var asdfg = 12; //true
var -name = "张三"; //false
var 5age = 18; //false
var $number = 888; //true
var gen2der = true; //true
var _$$$$$ = "456"; //true
var -fesdj = "2344"; //false
var 666 = 666; //false
var -name = "张三"; //false
var $name = "李四"; //true
var while = "开始"; //false
var _123 = "123"; //true
//输出下列typeof的结果 :
var num = 666;
typeof num; //number
typeof typeof num; //string
typeof "true" //string
var a;
typeof a; //undefined
a = true;
var b= "true";
typeof a; //boolean
typeof b; //string
b = a;
typeof a; //boolean
typeof b; //boolean
var age1 = 18;
var age2 = "20";
age1 = age2;
var age2;
console.log(age1,age2); //20 20
cosole.log(typeof age1, typeof age2); //string string
//请直接说出下面的结果
typeof(1) , //number
typeof(-1) //number
typeof(-1.1) //number
typeof(11), //number
typeof("111") //string
typeof(""）, //string
typeof(" "), //string
typeof("abc"), //string
var a = 1; typeof(a); //number
var a = 1; var b = 0 ;alert(a+b); //1
var a = 1 ; var b = "0"; alert(typeof(a+b)); //string
var a = 1 ; var b = 1 + "1"; alert(typeof(b)); //string
var a = "a"; alert(typeof(a+"")); //string
//1.写一个程序，要求用户输入鸡蛋数，如果20个鸡蛋放一盒，判断要多少个盒子。
//提示： （1）1个鸡蛋，需要一个盒子 （2）20个鸡蛋，需要一个盒子 （3）21个鸡蛋需要2个盒子
var num=prompt("请输入");
var lanzi=Math.ceil(num/20);
alert("你需要"+lanzi+"盒子");
//2.写一个程序，输入人数，每10人一列，要求站成一个方队（每队必须保持10人，不够就不要了），可以排多少列，余多少人。
var num=prompt("人数");
var lie=Math.floor(num/10);
var yu=num%10;
alert("可以排"+lie+"列"+"余"+yu+"人");
//3.写一个程序，随机生成0-100之间的三个数，分别输出，并且比较这三个数的大小。（打印出最大数和最小数）
var num1=Math.random()*100;
var num2=Math.random()*100;
var num3=Math.random()*100;
console.log(num1,num2,num3);
console.log(Math.max(num1,num2,num3));
console.log(Math.min(num1,num2,num3));
var num1=Math.random()*100;
var num2=Math.random()*100;
var num3=Math.random()*100;
alert("第一个数："+num1+"第二个数："+num2+"第三个数："+num3);
alert("最大值为："+Math.max(num1,num2,num3)+"最小值为："+Math.min(num1,num2,num3));
