Web前端认识day-08

一级目录

二级目录
三级目录

JavaScript是什么，能干什么？

一个网页的结构，是通过HTML决定的
CSS决定了这个网页的样式
这个网页的行为是通过JavaScript决定的

JavaScript发展史

它最初由Netscape的Brendan Eich设计。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript为基础制定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMAScript，文档对象模型，浏览器对象模型。 Netscape在最初将其脚本语言命名为LiveScript，后来Netscape在与Sun合作之后将其改名为JavaScript。JavaScript最初受Java启发而开始设计的，目的之一就是“看上去像Java”，因此语法上有类似之处，一些名称和命名规范也借自Java。但JavaScript的主要设计原则源自Self和Scheme。JavaScript与Java名称上的近似，是当时Netscape为了营销考虑与Sun微系统达成协议的结果。为了取得技术优势，微软推出了JScript来迎战JavaScript的脚本语言。为了互用性，Ecma国际（前身为欧洲计算机制造商协会）创建了ECMA-262标准（ECMAScript）。两者都属于ECMAScript的实现。尽管JavaScript作为给非程序人员的脚本语言，而非作为给程序人员的脚本语言来推广和宣传，但是JavaScript具有非常丰富的特性。发展初期，JavaScript的标准并未确定，同期有Netscape的JavaScript，微软的JScript和CEnvi的ScriptEase三足鼎立。1997年，在ECMA（欧洲计算机制造商协会）的协调下，由Netscape、Sun、微软、Borland组成的工作组确定统一标准：ECMA-262。

JavaScript的使用

在前端开发中，JavaScript不能单独运行（除非是单独安装了JavaScript运行坏境）
JavaScript必须挂载在网页上
HTML引入JavaScript有两种方式

方式一：内部引用

使用script标签，把JavaScript代码包起来
注意：内部引用的话要把代码放在网页的最下层，因为代码是的运行是从上到下的，而JavaScript是没有样式的，所以说如果把代码放在网页最上方就会造成因编译js代码导致的网页加载速度变慢

方式二：外部引用

将JavaScript代码单独放入js文件中
在HTML文件中引入js文件

<script src=”.js文件”></script>

外部使用的时候，一般来说都是放在的外面，也就是说上面下面都可以，在企业开发中，一般使用外部引入，这样做html与JavaScript的分开的，有利于分工合作，更方便后期的维护
变量
Var系统内部的关键字用来申明变量

变量的命名

规则：
1.变量名不能以数字开头（会与八进制或者十六进制冲突）
2.变量名只能包含数字，字母，下划线
3.区分大小写
4.变量名不能和系统内部关键字相同
5.建议：变量名要起得有意义

规范：
起名要见名知义，看到名字就知道这个变量是用来干嘛的
要使用英文单词，不要使用拼音，也不要使用中文
小驼峰命名是第一个单词首字母小写，从第二个单词开始后的每个单词首字母大写
数据类型
变量的数据类型是由数据的值决定的，不同的数据类型分配不同的存储空间大小。

数字类型：number，数字
字符类型：string，字母，汉字，符号“内容”，空字符也是字符类型“”
空类型：null，表示什么都没有
未定义类型：Undefined：表示没有定义（因为JavaScript中变量类型是由它的值来决定的，如果一个变量没有赋值，那它就是未定义）
布尔类型：true，false，boolean（bool）
复合数据类型：复杂类型，array数组，object对象（对象包含属性）
Typeof，查看数据的类型

字符串string
字符串是以但引号或者双引号

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

布尔类型Boolean
里面值有两个，true/false,表示真或者假。

未定义undefined
因为JavaScript中变量的类型是由他的值来决定的，如果一个变量没有给值，那么它就是未定义。

对象object
对象类型对象类型是很复杂的一个类型。
怎么去描述一个人，这个人有身高，体重，年龄，这时候就需要一个对象属性一切皆对象，对象包含属性的。
人对象：身高，体重，年龄…
狗对象：名字，花色，年龄…学生对象：学号，班级，成绩…
对象定义：

<script>
    //方式一：创建对象
    var dog={
        name:"藏獒",
        color:"yellow",
        age:20
    };
    dog.sex='公';
    console.log(dog);
    console.log(dog.name+"的颜色是"+dog.color);
    //方式二：通过new
    var cat=new Object();
    cat.name="小花";
    cat.age=25;
    cat.sex='母';
    cat.color="green";
    console.log(cat);
</script>

如何访问对象：
对象名称.属性名

注意：创建对象时对象属性用都好隔开，最好在代码开始的就声明所有变量 语句与注释
语句：
一行一行的代码就叫做语句，一个语句使用分号作为结束符；虽然JavaScript不写分号没有问题，但是带了项目上线代码压缩的时候就会出现问题。

注释：
对代码的解释，为了让你和你同事可以轻松的看懂你的的代码
注释不会影响代码的运行，注释也可以阻止代码的运行（注释掉要执行的代码）

方式一：单行注释
//注释的语句

方式二：多行注释

/*注释的语句*/

运算符
算数运算符
+，-，*，/，%（取余），++（自增），–（自减）
j=n++与j=++n的区别 n++是先把n赋值给j，i再加1
++n是n先加1，再吧值赋值给j

赋值运算符

在JavaScript里“=”表示赋值，“==”表示等于

1
复合运算符
+=、-=、*=、/=
n+=5就是n=n+5其他同理

关系运算符

>、<、>=、<=、==、!=、===（全等于）、!==（不全等于） 比较返回结果为布尔值，true、false
===：判断两个数据类型是否相同，数值与类型都相同则返回true
==与===的区别：
==：比较值
===：比较值和类型

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

三元运算符
表达式?结果1:结果2
如果表达式运行结果为true，则返回结果1 如果表达式运行结果为false，则返回结果2