JavaScript的使用

在前端开发中，JavaScript不能单独运行（除非是单独安装了JavaScript的运行环境）
JavaScript必须挂载在网页上

HTML引入JavaScript代码，有两种方式
方式一：内部引用
使用script标签，把JavaScript代码包起来

<script type="text/javascript">
        alert("我是java script");
        alert("hello world");
</script>

注意：内部引用的话把代码放在最下层
因为代码的运行从上而下的
而JavaScript是没有样式的，我们看不到它的
所以说如果把代码放在网页最上方的话就会造成因编译js代码导致的网页加载，速度变慢
方式二：外部引用
（1） 将JavaScript代码单独放在js文件中

alert("hello world");

（2）在HTML文件中引入js文件

<script src="js/js外部引用.js" type="text/javascript" ></script>

注意：外部引用的时候，一般来说都是放在的外面，也就是说上面或者下面都可以
在企业开发中，一般都使用外部引入，这样做HTML与JavaScript是分开的
有利于分工合作，更方便后期的维护

程序设计的基础

数据类型与变量
计算机程序就是处理现实生活中各种数据
数据包括几个属性：名字，值，类型
生活中的数据并不是一成不变的，所以javascript里就有变量和它对应
变量
Var variable的简写，声明一个变量

<script type="text/javascript">
    var name;
    var price;
    var num;
</script>

变量的命名

规则：
（1） 一般情况下，变量名由大小写字母和数字组成，也可以使用$,_的特殊符号
（2） 到时呢，变量名是不能以数字开头的，这样会与八进制或十六进制冲突
（3） 关键字不能用，关键字这个名字已经被JavaScript内部使用了
规范：
（1） 起名要见名思义，看到名字就知道这个变量是用来干嘛的
（2） 要使用英文单词，不要使用拼音，也不要使用中文
（3） 小驼峰：第一个单词以小写开始，第二个单词开始以后的每个单词的首字母都采用大写字母
数据类型
变量的类型是有变量的值来决定，不同的类型分配给存储空间的大小也是不同的
Typeof:查看变量类型

<script type="text/javascript">
    var name="龙";
    var price=20.21;
    var num=10;
    var success=true;
    alert(typeof (name));//string
    alert(typeof (price));//number
    alert(typeof (num));//number
    alert(typeof (success));//boolean
</script>

字符串string
字符串是以单引号或双引号括起来的任意文本
“asd” “zhangsan”+”feng”

<script type="text/javascript">

    //字符串的拼接
    alert("asd");//asd
    alert("zhangsan"+"feng");//zhangsanfeng
    alert("zhangsan"+7+5);//zhangsan75
    alert(12+3+"zhangsan");//15zhangsan
</script>

数字number
数字：整数和小数。但在JavaScript里不区分整数与小数，统一number
10进制，2进制，8进制，16进制都算number

布尔类型Boolean
Boolean里面值只有两个：true、false，表示真或假

未定义underfined

<script type="text/javascript">
    var num;
    alert(num);
</script>

因为JavaScript中变量的类型是由他的值决定的，如果一个变量没有给值，那么他就是未定义
对象类型
对象类型是很复杂的一个类型
怎么去描述一个人，这个人有身高，体重，年龄，这个时候就需要一个对象属性，一切皆有对象，对象包含属性
人对象：身高，体重，年龄……
狗对象：名字，花色，年龄……
学生对象：学号，班级，成绩……

<script>
    var dog={
        name:"藏獒",
 **加粗样式**       color:"灰色",
        age:3
    }
    dog.sex="公";
    //alert("狗的性别是"+dog.sex);
    //方式二：通过new
    var cat=new Object();
    cat.name="小黄";
    cat.age=4;
    cat.color="yellow";
    alert("猫的颜色是"+cat.color);
</script>

如何访问对象：
对象名称 属性名
注意：创建对象时对象属性用逗号隔开，而不是分号
最好在代码开始就声明所有的变量
语句与注释
语句
一行一行的代码就叫做语句，一个语句的使用分号作为结束符
虽然JavaScript不写分号没有问题，但是到了项目上线代码压缩的时候就会出现问题
所以说要写上分号
注释
对代码的解释，为了让你和你的同事可以很轻松的看懂你的代码
注释不规范，同事两行泪
注释写与不写都不会影响代码的运行，注释与代码的结果没有关系
当然了，也可以用来阻止代码的运行（注释掉将要执行的代码）
方式一：单行注释
在语句最前面打上两个//(在shift键左边)

//alert("狗的性别是"+dog.sex);

方式二：多行注释

/*var cat=new Object();
cat.name="小黄";
cat.age=4;
cat.color="yellow";
alert("猫的颜色是"+cat.color);*/

运算符
算术运算符
+，-，*，/,%（取余）

<script type="text/javascript">
    var a,b;
    a=8;
    b=5;
    alert(a+b)//13
    alert(a-b)//3
    alert(a*b)//40
    alert(a/b)//1.6
    alert(a%b)//3
</script>

赋值运算符
++（自增）–（自减）
n++等于n=n+1
n—等于n=n-1
++n与—n
n++与++n的区别
++在前面，先加再用，++在后面，先用后加
不管++在前面还是后面，只要运行了，数值都会增加

<script type="text/javascript">
    var a,b,c;
    a=10;
    b=a++;
    c=++a;
    alert(b);//10
    alert(c);//12
</script>

复合运算符
在JavaScript里等于号代表赋值，==代表等于
复合赋值运算符：+=，-=，*=，/=
n+=5就是n=n+5其他同理

<script type="text/javascript">
    var a,b;
    a=1;
    b=2;
    a+=5;
    b*=5;
    alert(a);//6
    alert(b);//10
</script>

关系运算符
常见的关系运算符

>（大于）, < （小于）,>=（大于等于）,<=（小于等于）,==（等于）,!=（不等于）
判断两个数字是否想等，使用两个等于号（==）

JavaScript特有：

===：数值与类型全部等于才true
!==：数值与类型全都不等于才true
比较后的结果是boolean类型，true或false
<script type="text/javascript">
    var a,b,x,y;
    a=10;
    b="10";
    alert(a==b);//true
    x=5;
    y="5";
    alert(x===y);//false
</script>
重点===与==的区别：
==只比较值
===比较值和类型

逻辑运算符
与运算（&&） 所有条件都满足，才成立
或运算（||）或者 只要满足其中一个条件，就成立
非运算（！）取反 真变假，假变真

<script type="text/javascript">
    var a,b;
    a=5;
    b=10;
    alert(a>3&&b<20);//true
    alert(a<4||b>8);//true
    alert(!(a=6));//false
</script>

三目运算符（三元运算符）
表达式？结果1：结果2
如果表达式运行结果是true，运行结果1
如果表达式运行结果是false，运行结果2

<script type="text/javascript">
    var a;
    a=10;
    alert(a>10?"10":"20");//false
</script>