基础语法
引入方式
引入方式
内部脚本：将JS代码定义在HTML页面中
-
JavaScript代码必须位于<script></script>标签之间
-
在HTML文档中，可以在任意地方，放置任意数量的<script>
-
一般会把脚本置于<body>元素的底部，可改善显示速度
外部脚本：将 JS代码定义在外部 JS文件中，然后引入到 HTML页面中
-
外部JS文件中，只包含JS代码，不包含<script>标签
-
<script>标签不能自闭合
输出语句
输出语句
-
使用 window.alert() 写入警告框
-
使用 document.write() 写入 HTML 输出
-
使用 console.log() 写入浏览器控制台
变量声明
变量
-
JavaScript 中用 let 关键字来声明变量
-
JavaScript 中用 const 关键字来声明常量
-
JavaScript 是一门弱类型语言，变量可以存放不同类型的值
-
变量名需要遵循如下规则：
-
组成字符可以是任何字母、数字、下划线（_）或美元符号（$）
-
数字不能开头
-
建议使用驼峰命名
-
数据类型
数据类型
JavaScript中也有数据类型的概念,主要有下面几种
原始类型
-
string：字符串，单双引皆可
-
number：数字（整数、小数、NaN(Not a Number)）
-
boolean：布尔。true，false
-
object：对象和null
-
undefined：当声明的变量未初始化时，该变量的默认值是 undefined
-
使用 typeof 运算符可以获取数据类型
运算符
运算符
== 与 ===
特殊用法
-
字符串字面值参与运算的时候会自动转为数字(加法除外)
-
除法运算会按照人类运算执行,根java中的除法有所区别
流程控制
流程控制语句
流程控制
类型转换
在js中,任何类型都可以转为boolean：
-
Number：0 和 NaN为false，其他均转true
-
String：空字符串为false，其他均为true
-
对象: Null 和 undefined为false, 其它均为true
函数和事件
函数
定义方式一：
-
介绍：函数（方法）是被设计为执行特定任务的代码块。
-
定义：JavaScript 函数通过 function 关键字进行定义，语法为：
-
注意：
-
形式参数不需要类型，因为Js是弱类型语言
-
返回值也不需要定义类型，可以在函数内部直接使用return返回即可
-
js中如果出现同名的方法，后面的会覆盖前面的
-
调用：函数名称(实际参数列表)
定义方式二：
-
JS中，函数调用可以传递任意个数的参数
事件
事件
-
事件：HTML事件是发生在HTML元素上的 “事情”。比如：
-
按钮被点击
-
鼠标移动到元素上
-
按下键盘按键
-
-
事件监听：JavaScript可以在事件被侦测到时 执行代码。
事件绑定
-
方式一：通过 HTML标签中的事件属性进行绑定
-
<input type="button" οnclick="on()" value="按钮1">
<script> function on(){ alert('我被点击了!'); } </script>
-
方式二：通过 DOM 元素属性绑定
-
<input type="button" id="btn" value="按钮2">
<script> document.getElementById('btn').οnclick=function(){ alert('我被点击了!'); } </script>
对象
数组对象
数组对象
-
JavaScript 中 Array对象用于定义数组
-
定义
let 变量名 = new Array(元素列表); //方式一 let 变量名 = [ 元素列表 ]; //方式二
-
访问
-
arr[ 索引 ] = 值;
注意事项
-
JavaScript 中的数组相当于 Java 中集合，数组的长度是可变的，而 JavaScript 是弱类型，所以可以存储任意的类型的数据。
属性
方法
-
箭头函数(ES6)：是用来简化函数定义语法的。具体形式为: (…) => { … } ， 如果需要给箭头函数起名字： let xxx = (…) => { … }
字符串对象
字符串对象
-
String字符串对象创建方式有两种：
let 变量名 = new String("…") ; //方式一 let 变量名 = "…" ; //方式二
属性
方法
自定义对象
自定义对象
-
定义格式：
let 对象名 = { 属性名1: 属性值1, 属性名2: 属性值2, 属性名3: 属性值3, 方法名: function(参数){ 方法体 } };
-
调用格式
-
对象名.属性名; 对象名.函数名();
JSON对象
JSON-介绍
-
概念：JavaScript Object Notation，JavaScript对象标记法。
-
JSON 是通过 JavaScript 对象标记法书写的文本，跟js对象的主要区别就在于，JSON中的键必须是字符串类型
JSON-基础语法
-
定义
let 变量名 = '{"key1": value1, "key2": value2}';
-
JSON字符串转为JS对象
let jsObject = JSON.parse(userStr);
-
JS对象转为JSON字符串
let jsonStr = JSON.stringify(jsObject);
BOM对象
BOM
-
概念：Browser Object Model 浏览器对象模型，允许JavaScript与浏览器对话， JavaScript 将浏览器的各个组成部分封装为对象。
Window
-
介绍：浏览器窗口对象。
-
获取：直接使用window，其中 window. 可以省略。
-
属性
-
history：对 History 对象的只读引用。请参阅 History 对象。
-
location：用于窗口或框架的 Location 对象。请参阅 Location 对象。
-
navigator：对 Navigator 对象的只读引用。请参阅 Navigator 对象。
-
-
方法
-
alert()：显示带有一段消息和一个确认按钮的警告框。
-
confirm()：显示带有一段消息以及确认按钮和取消按钮的对话框。
-
setInterval()：按照指定的周期 （以毫秒计）来调用函数或计算表达式。
-
setTimeout()：在指定的毫秒数后调用函数或计算表达式。
-
Location
-
介绍：地址栏对象。
-
获取：使用 window.location 获取，其中 window. 可以省略。
-
属性： href：设置或返回完整的URL。
DOM对象
DOM
-
概念：Document Object Model ，文档对象模型。
-
将标记语言的各个组成部分封装为对应的对象：
-
Document：整个文档对象
-
Element：元素对象
-
Attribute：属性对象
-
Text：文本对象
-
Comment：注释对象
-
-
HTML中的Element对象可以通过Document对象获取，而Document对象是通过window对象获取的。
-
Document对象中提供了以下获取Element元素对象的函数：
ajax
ajax
Ajax
-
概念：Asynchronous JavaScript And XML，异步的JavaScript和XML。
-
作用：
-
数据交换：通过Ajax可以给服务器发送请求，并获取服务器响应的数据。
-
异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索联想、用户名是否可用的校验等等。
-
同步与异步
原生Ajax
-
创建XMLHttpRequest对象：用于和服务器交换数据
-
向服务器发送请求
-
获取服务器响应数据
axios
Axios
-
介绍：Axios 对原生的Ajax进行了封装，简化书写，快速开发。
请求方式别名
本站资源均来自互联网，仅供研究学习，禁止违法使用和商用，产生法律纠纷本站概不负责！如果侵犯了您的权益请与我们联系！
转载请注明出处： 免费源码网-免费的源码资源网站 » WEB06JavaScript&Ajax
发表评论 取消回复