javaweb02-JavaScript&vue

合集 - javaweb入门(7)

1.javaweb02-JavaScript&vue2024-02-28

2.javaweb01-html&css2024-02-283.javaweb03-前端工程2024-03-054.javaweb04-maven&web入门2024-03-055.javaweb05-请求响应&分层耦合2024-03-056.javaweb06-Mysql数据库2024-03-057.javaweb07-Mybatis2024-03-05

收起

JavaScript

控制网页行为

js引入方式#

• 内部脚本：script标签

• 外部脚本：js文件

js基础语法#

书写语法#

• 区分大小写
• 每行结尾分号可有可无，建议写上

输出语句#

• 警告框 window.alert
• html输出 document.write
• 浏览器控制台 console.log

变量#

用 var 关键字声明变量

JavaScript是一门弱类型语言 变量可以存放不同类型的值

特点

• 作用域较大，属于全局变量
• 可以重复定义
• es6中提供了两种新的变量定义方式

let：局部变量 const：只读常量 常量值不能改变

数据类型、运算符#

数据类型#

typeof 获取数据类型

运算符#

== 与 ===的比较

== 会进行类型转换 === 不会进行类型转换

类型转换

• parseInt
• 自动转换

js函数#

定义：通过function关键字进行定义

js对象#

Array#

定义数组

特点：长度可变、类型可变

常用方法

• fori：遍历函数，遍历数组中每个元素

• forEach：遍历函数，遍历数组中有值的元素

• push：在数组末尾添加元素

• splice：删除元素

String#

常用方法

• charAt：返回指定位置字符
• indexOf：索引字符串
• trim：去除两边空格
• sunstring：根据指定索引提取字符

JSON#

key-value键值对，用于作数据载体

js对象与json的转换

• JSON.parse：将String -> js对象
• JSON.stringify：将js对象 -> String

BOM#

浏览器对象模型

window#

方法:

• alert
• confirm
• setInterval
• setTimeout

location#

地址栏对象

属性：

url

DOM#

文档对象模型：将标记语言封装为对应的对象

js事件#

事件绑定#

• 方式一：通过html标签中的事件属性进行绑定
• 方式二：获取DOM对象进行绑定

常见事件#

Vue

前端框架，免除JavaScript中的DOM操作，实现数据的双向绑定

常用指令#

区别 v-show 与 v-if 渲染

生命周期#

一个对象从创建到销毁

mounted