Javascript

Javascript

###一、Javascript简介

1.什么是Javascript

Javascript简称JS，由网景公司开发的客户端脚本语言，不需要编译，可以直接运行

web前端三层：

• 结构层HTML，定义页面的结构
• 样式层css，定义页面的样式
• 行为层Javascript用来实现交互，提升用户的体验

2.Javascript的作用

• 在客户端浏览器上动态的操作页面
• 在客户端浏览器上做数据的校验
• 可以在客户端上发送异步请求

二、引用方式

1.内联方式

在页面中使用script标签，在script标签中编写js代码

script可以放在页面的任意位置，一般放在头部

<script>
        js代码
</script>

2.行内方式

在普通标签中编写js代码，一般需要结合事件的属性，如onclick、onmouseover等

提示：什么是事件属性？----面向对象

eg：对象—外观修饰—css实现

​ 行为、事件—某一事件发生的对象不一样，所引发的反应也不会相同----对象的多态性

3.外联方式（外部方式）

使用单独的.js方式定义，然后再页面中使用script标签引用外部脚本文件

<!--2.行内方式-->
    <input type="button" value="点我" onclick=alert("被点击了，晕了")>
    <!--<a href="" onclick="alert('超链接被触发')"></a>-->
    <a href="javascript:alert('超链接被触发')">超链接</a>

    <div onmouseover="alert('走开')">把鼠标移上来</div>

注意：如果某个script标签用于引用外部js文件，则读script标签的标签体中不能写js带码

三、基本语法

1.变量

变量是用来存储常量的量

常量就是固定值 --常数项

这是一门弱类型语言，声明变量时使用var关键字，不需要指定变量的类型

语法：var变量名=常量或表达式

在ECMAscript 6规范中新增let关键字，也用于声明变量

使用let 声明变量支持块级作用域，而使用var声明的变量不支持块级作用域

注：在ECMA中配置ES版本 settings–language&frameworks–JavaScript-- language version

变量的命名规则：

• 有字母、数字、下划线、汉字组成
• 由字母、下划线开头
• 不能和系统关键字重名
• 区分大小写

了解：变量名的命名；

输入和输出

输出：

• alert() 弹出警告窗
• console.log() 输出到浏览器的控制台
• document.write() 输出到页面

输入：

• prompt()弹出输入框，获取用户输入的数据

使用typeof变量判断变量的类型

使用number(变量)将字符串转换为数值

3.转义字符

常用转义符：

• \n 换行
• \t 向右缩进一个制表位
• \" 双引号
• \' 单引号
• \\ \ 斜杠

4.注释

单行注释 //

多行注释 /* 注释内容 */

5.编码规范

代码是区分大小写的

每条语句以分号结尾

代码要注意缩进

四、核心语法

1.数据类型

常量：具体值，不变的量—常数项

变量：变化的量，存储常量的量

基础数据类型：

• string字符串

• number数值（NaN表示非数字Not a Number 类型，表示数值的不正常状态）

• Boolean 布尔

• null空类型

• underfined 未定义类型

• 转换number

使用number（）、parselnt（）、persefloat（）

• 转换为字符串

拼接空字符串

• 转换为布尔Boolean

使用Boolean（）

注意：0、空字符串、null、underfined、NaN会被转换为

false，其他被转为true

2.运算符

算术运算符：+、-、*、/、%取余、**乘方、++、–

比较运算符：>、>=、<、<=、、=、！=不等于

赋值运算符：=、+=、-=、*=、/=、%=

逻辑运算符：&&并且、||或者、！非

条件运算符：条件？表达式1：表达式2

3.选择结构

if…else、switch

4.循环结构

while、do…while、for、for…in

break、continue

break：推出整个循环

continue：结束本次循环，返回到条件判断处继续进行下一次执行循环的条件判断

5.数组

5.1定义方式

语法：

var arr = new array();
var arr = new array(值一，值2，…);
var arr = [值1，值2…];

注意：

• 数组的长度会自动扩展
• 数组中元素的默认值为undefined
• 使用length属性来获取数组的长度

5.2数组的常用方法

方法	描述
sort（）	排序，默认按字符编码进行升序列，非string类型就自动转换为string可自定义比较规则
reverse	反转，将数组元素倒序排列
join	将数组中的元素使用指定的分隔符练成字符串，默认通过逗号连接
indexOf（）	返回指定元素在数组中首次出现的位置
slice	截取数组中缩影从begin到end之间的数组，左闭右开，如果省略到第二个参数，则表示截取到末尾
tostring	将数组转换为字符串

5.2二维数组

二维数组可看认为是一个特殊的一维数组，即一维数组中的每个元素又是一个一维数组

var arr = new array();//定义了一个具有m行个元素的特殊的一维数组
arr[0] = new array();//第0行有n个元素
arr[1] = new array();//第一行有n个元素
arr[][]=值;

var arr =[
    [值1，值2……]
    [值1，值2……]
    [值，值2……]
]