JavaScript随笔

最新推荐文章于 2024-09-07 14:37:16 发布

san-m

最新推荐文章于 2024-09-07 14:37:16 发布

阅读量96

点赞数

文章标签： servlet 前端

本文链接：https://blog.csdn.net/qq_58692689/article/details/127984212

版权

JS笔记

介绍

JavaScript简称JS,是一种脚本编程语言,兼容函数式变阿城和面向对象编程,是Web前端开发的唯一选择,JavaScript有很多框架,如JQuery,AngularJS,React,Vue等,他们是学习JavaScript的重要内容.

node.js === JRE,JRE运行java字节码文件

js运行环境:

浏览器
node.js 桌面端的运行环境,服务器端

历史

它最初由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代码必须位于标签之间,脚本可被放置于HTML页面的或部分中,或兼而有之

外部脚本

脚本可放置在外部文件中，外部脚本很实用，如相同的脚本被用于许多不同的网页。JavaScript 文件的文件扩展名是 .js。如需使用外部脚本，请在

外部JavaScript的优势

分离了 HTML 和代码
使 HTML 和 JavaScript 更易于阅读和维护
已缓存的 JavaScript 文件可加速页面加载

外部脚本的加载

—般情况下，在文档的标签中包含 JavaScript 脚本，或者导入的 JavaScript 文件。这意味着必须等到全部 JavaScript 代码都被加载、解析和执行完以后，才能继续解析后面的 HTML 部分。如果加载的 JavaScript 文件很大， HTML 文档解析就容易出现延迟。

为了避免这个问题，在开发 Web 应用程序时，建议把导入 JavaScript 文件的操作放在后面，让浏览器先将网页内容解析并呈现出来后，再去加载 JavaScript 文件，以便加快网页响应速度。

JavaScript延迟加载

示例：

在下面示例中，外部文件 common.js 包含的脚本将延迟到浏览器解析完网页之后再执行。浏览器先显示网页内容，然后才弹出提示文本。如果不设置 defer 属性，则执行顺序是相反的。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/common.js" defer="defer"></script>
	</head>
	<body>
		<div style="width: 200px;height: 200px;background-color: #0062CC;">hello world</div>
	</body>
</html>

异步加载JavaScript文件

在默认情况下，网页都是同步加载外部 JavaScript 文件的，如果 JavaScript 文件比较大，就会影响后面 HTML 代码的解析。上面提到一种解决方法：就是最后加载 JavaScript 文件。

现在可以为

JavaScript代码块

代码块就是使用

示例1:

<script>
var welcome="欢迎使用javascript代码块";
</script>
<script>
console.log(welcome);
</script>

浏览器在解析这个 HTML 文档时，如果遇到第一个

示例2:

如果在一个 JavaScript 代码块中调用后面代码块中声明的变量或函数，就会提示语法错误。

<script>
console.log(welcome);
</script>
<script>
var welcome="欢迎使用javascript代码块";
</script>

如果把两块代码放在一起,就不会出现上述错误:

<script>
	console.log(">>>"+welcome);   // 输出  >>>undefined 
	var welcome = "欢迎使用javascript代码块";
</script>

声明变量

js中全局对象window

var声明变量
- 在函数外部声明的变量都是全局变量
- 全局变量会增加到window对象上
- var声明的变量不具备代码块作用域
- 没有用var声明的变量直接使用也是全局变量
- 只声明变量不赋值 ,它的值是undefined
- var声明的变量具有变量提升的作用(js在执行前会将所有声明的变量提升到前面,并初始化为undefined)
let 声明变量(es6引入的)
- 在函数外声明的变量都是全局变量,但是它不会增加到window对象上
- let声明的变量具有代码块作用域(更严谨.推荐使用它声明变量)
- 从表面上看,let声明的变量不具备变量提升的作用(变量必须先声明后使用)是因为它存在着暂时性死区,既在变量声明之前访问时,会报错
const声明常量
- const声明的常量只能赋值一次,且只能在声明时赋值
- 在函数外声明的变量都是全局变量,但是它不会增加到window对象上
- const声明的变量具有块级作用域
- 因为它存在着暂时性死区,既在常量声明之前访问会报错
- const的本质:const定义的变量并非常量,并非不可变,它定义了一个常量引用的一个值,使用const定义的对象或者数字,其实是可变的

数据类型

基本类型

字符串String

数字Number

布尔Boolean

空Null

未定义Undefined

Symbol(es6引入的独一无二)
引用类型

对象Object

数字Array

函数Function

基本类型与引用类型的区别:

基本类型存储在栈中,作用域结束释放内存

引用类型的变量存储在栈中(作用域结束释放),内容存储在堆中(没有变量引用时释放)

字符串方法:

js对象中的原型方法(Object.prototype.method)类似于java的成员方法(成员方法通过对象调用)

js对象上的方法(Object.method)类似于java的静态方法(通过类名调用)

常用方法:

indexOf 查找
split 分隔方法参数可以是正则表达式

js中正则表达式的定义方式:
```
let reg = /^1[3456789]\d{9}$;
//验证手机号的规则
```
substring(indexStart[,indexEnd])截取字符串,包含起始位置,不包含结束位置
trim() 清除左右空格
replace() 替换部分字符串
replaceAll() 替换全部字符串