JavaScript课堂笔记一

最新推荐文章于 2024-05-21 14:15:14 发布

在看AI

最新推荐文章于 2024-05-21 14:15:14 发布

阅读量163

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/woshinibabaang/article/details/118240443

版权

1、概述

1.1 什么是JavaScript？

1.1.1 概念

JavaScript 是脚本语言，是一种解释性脚本语言（代码不进行预编译）

JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。

JavaScript 很容易入门。

1.1.2 作用

1、为网页添加各式各样的动态功能,

2、为用户提供更流畅美观的浏览效果。

通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。

1.2 JavaScript历史

它最初由Netscape的Brendan Eich设计。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript 为基础制定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript 实现包含三个部分：ECMAScript，文档对象模型，浏览器对象模型。

1.3 JavaScript的用法

JavaScript通常简称为js,或者js脚本。

1.3.1 HTML页面中的JavaScript

在html页面中的脚本必须位于script围堵标签之间，script标签放在head中可以，body中也可以，放在最后也可以，对位置要求不严格

我们可以在 HTML 文档中放入不限数量的script标签，通常的做法是把内容统一放入head或者页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

PS:有些案例中可能会在 script 标签中出现type="text/javascript"。现在完全可以省略了，JavaScript已经是所有现代浏览器以及 HTML5 中的默认脚本语言。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JavaScript的用法</title>
<script>
alert("hello JavaScript1-1");
</script>
<script>
alert("hello JavaScript1-2");
</script>
</head>
<body>
<script>
alert("hello JavaScript2-1");
</script>
<script>
alert("hello JavaScript2-2");
</script>
</body>
</html>
<script>
alert("hello JavaScript3-1");
</script>
<script>
alert("hello JavaScript3-2");
</script>

1.3.2 外部的JavaScript

可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。外部 JavaScript 文件的文件扩展名是 .js。

当我们使用外部文件时，在HTML页面的script 标签的 "src" 属性中设置该 .js 文件：

myScript.js文件 //外部js文件中不能有script标签，直接编写JavaScript脚本代码即可
function fun1(){
alert("hello JavaScript");
}
<!DOCTYPE html>
<html>
<head>
<script src="js/myScript.js"/>
</head>
<body>
<script>
fun1();//调用脚本中的内容s
</script>
</body>
</html>
外部文件引入一次即可，在head或者body中都可以。

PS:外部脚本不能包含 script 标签。

1.3.3 标签属性中的JavaScript

直接编写在HTML标签的一些属性中，用于简单的JavaScript代码的编写，用的偏少。

<a href="javascript:alert('ok')">登录</a>

1.4 JavaScript显示数据

1.4.1 使用window.alert()弹出框

PS：这里的window可以省略，等价于alert("hello world");

1.4.2 使用document.write()将内容写入到html文档

1.4.3 使用innerHTML写入到html元素

1.4.4 使用console.log写入到浏览器控制台

2、JavaScript的注释

JavaScript注释与java的单行和多行注释相同。

单行注释以 // 开头。

多行注释以 /* 开始，以 */ 结尾。

3、JavaScript基本语法

JavaScript 是一个脚本语言。它是一个轻量级，但功能强大的编程语言。

3.1 JavaScript变量

声明变量的关键字：

var 语法：

var 变量名称；

变量的命名规则：

变量必须以字母开头

变量也能以 $ 和 _ 符号开头

变量名称对大小写敏感（y 和 Y 是不同的变量）

不能使用关键字保留字

变量的命名规范：

见名知意。例如：breadPirce,userService等，避免无意义的a,b,c等推荐驼峰命名法，即第一个单词的首字母小写，以后每个单词的首字母大写。

3.2 JavaScript的语句

JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。

JavaScript 是脚本语言，浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。

3.3 JavaScript的数据类型

3.3.1.1 字符串String

字符串是存储字符的变量。字符串可以是引号中的任意文本。必须使用单引号或双引号；

3.3.1.2 数字Number

JavaScript 只有一种数字类型。数字可以带小数点，也可以不带：

3.3.1.3 布尔Boolean

只能有两个值：true 或 false。

3.3.1.4 空Null

var email=null;

3.3.1.5 未定义Undefined

表示变量不含有值。可以通过将变量的值设置为 null 来清空变量。

1、变量声明且没有赋值；

var obj;
alert(obj);//obj值为undefined

2、获取对象中不存在的属性时；

var obj;
alert(obj.name);//报错信息： "Uncaught TypeError: Cannot read property 'name' of
undefined"

3、函数需要实参，但是调用时没有传值，形参是undefined；

4、函数调用没有返回值或者return后没有数据，接收函数返回的变量是undefined。

function printNum(num){
alert(num);
}
var result=printNum();//调用函数未传递参数，执行函数的时候num的值是undefined
alert(result);//result的值也是undefined，因为printNum()没有返回值

3.3.1.6 Symbol

后续介绍

3.3.2 引用数据类型：

对象(Object)、数组(Array)、函数(Function)。

3.3.3 JavaScript拥有动态类型

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型：

var param; // param类型为 undefined
param = 5; // 现在 param 为数字
param = "John"; // 现在 param 为字符串

3.4 JavaScript中的运算符

运算符的运算规则与java一样，在这里不再赘述。

说两个特殊的

4、JavaScript对象

4.1 JavaScript的String对象

4.1.1 String对象属性--长度属性

var str="我喜欢看NBA,最喜欢的球员是\'小学生\'库里";
//注意：字符串中出现的\'是一个字符，转义为一个单引号
console.log(str);
//获取字符串的长度：，切记：所有转移符号的长度都算一个，即\'长度为1
console.log("字符串的长度="+str.length);//22

4.1.2 String对象方法

和java的String方法类似，需要自己查表

4.2 JavaScript的Array对象

Array 对象用于在变量中存储多个值，也就是数组。

4.2.1 声明数组

4.2.2 数组的长度 length属性

PS：大家需要注意的length是数组的属性，不是方法，所以调用的时候没有括号。

var nameArr=["宝玉","黛玉","湘云"];
var len=nameArr.length; //获取数组的长度

4.2.2 Array对象的方法

查表

4.3 JavaScript的Date对象

4.3.1 创建日期对象

var date1 = new Date();
var date2 = new Date(milliseconds);
var date3 = new Date(dateString);
var date4 = new Date(year, month, day, hours, minutes, seconds, milliseconds);

4.3.2 日期对象的常用方法

4.4 JavaScript的Math对象

4.4.1 Math常用属性

var pi=Math.PI;//返回圆周率

4.4.2 Math常用方法

var num=Math.random();// 返回 0 ~ 1 之间的随机数。
var max=Math.max(12,34,-90,9);//返回 n个数值中的最大值。
var min=Math.min(12,34,-90,9);//返回 n个数值中的最小值。

5 JavaScript调试

浏览器 f12 可以打断点进行调试

6、JavaScript的函数

6.1.1 isNaN(param) 用于检查其参数是否是非数字值。

是数值的返回false，不是数值返回true。

console.log(isNaN(666));//false
console.log(isNaN(1+2));//false
console.log(isNaN("hello"));//true

6.1.2 parseFloat(String)

可解析一个字符串，并返回一个浮点数。该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串。

console.log(parseFloat("66"));//66
console.log(parseFloat("199.99"));//199.99
console.log(parseFloat("1024 2048 4096"));//1024
console.log(parseFloat(" 128 "));//128
console.log(parseFloat("10年"));//10
console.log(parseFloat("今天是8号"));//NaN

字符串中只返回第一个数字。

开头和结尾的空格是允许的。

如果字符串的第一个字符不能被转换为数字，那么 parseFloat() 会返回 NaN。

6.1.3 parseInt(string,radix)

可解析一个字符串，并返回一个整数

console.log(parseInt("66"));//66
console.log(parseInt("199.99"));//199
console.log(parseInt("1024 2048 4096"));//1024
console.log(parseInt(" 128 "));//128
console.log(parseInt("10年"));//10
console.log(parseInt("今天是8号"));//NaN
console.log(parseInt("10",10));//10
console.log(parseInt("010"));//10
console.log(parseInt("10",8));//8
console.log(parseInt("0x10"));//16
console.log(parseInt("10",16));//16
PS:旧浏览器由于使用旧版本的ECMAScript（ECMAScript版本小于ECMAScript 5，当字符串以"0"开
头时默认使用八进制，ECMAScript 5使用的是十进制），所以在解析("010") 将输出8。

只有字符串中的第一个数字会被返回。

开头和结尾的空格是允许的。

如果字符串的第一个字符不能被转换为数字，那么 parseInt() 会返回 NaN。

在字符串以"0"为开始时旧的浏览器默认使用八进制基数。ECMAScript 5，默认的是十进制的基数

6.2 JavaScript的自定义函数

6.2.1 自定义函数语法

使用function关键字定义函数。

function 自定义函数名称(参数列表){
//函数体
}

6.2.2 自定义函数实例

注意：

1、函数的形参直接写参数名称，不需要声明类型，即不需要写var.

2、函数的返回取决于函数体中是否有return关键字。

6.3 JavaScript的匿名函数

在看AI

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript课堂笔记一

1、概述1.1 什么是JavaScript？1.1.1 概念JavaScript 是脚本语言，是一种解释性脚本语言（代码不进行预编译）JavaScript 是一种轻量级的编程语言。JavaScript 是可插入 HTML 页面的编程代码。JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。JavaScript 很容易入门。1.1.2 作用1、为网页添加各式各样的动态功能,2、为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入
复制链接

扫一扫