js基础初识

最新推荐文章于 2024-08-22 14:32:34 发布

海上的魔鬼船

最新推荐文章于 2024-08-22 14:32:34 发布

阅读量53

点赞数

文章标签： javascript 前端 css

本文链接：https://blog.csdn.net/youngbird1998/article/details/126826473

版权

浏览器执行JS简介

浏览器分成两部分：渲染引擎和 JS 引擎

渲染引擎：用来解析HTML与CSS，俗称内核，比如 chrome 浏览器的 blink ，老版本的 webkit
JS 引擎：也称为 JS 解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如 chrome 浏览器的 V8

浏览器本身并不会执行JS代码，而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码。JS 引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以 JavaScript 语言归为脚本语言，会逐行解释执行。

JS的组成

在这里插入图片描述

ECMAScript

ECMAScript 是由ECMA 国际（原欧洲计算机制造商协会）进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为 JavaScript 或 JScript，但实际上后两者是 ECMAScript 语言的实现和扩展。
在这里插入图片描述
ECMAScript：ECMAScript 规定了JS的编程语法和基础核心知识，是所有浏览器厂商共同遵守的一套JS语法工业标准。

DOM文档对象模型

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过 DOM 提供的接口可以对页面上的各种元素进行操作（大小、位置、颜色等）。

BOM浏览器对象模型

BOM (Browser Object Model，简称BOM) 是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等。

1、JS初体验

1.1、行内式JS

<input type="button" value="点我试试" onclink="javascript:alert('Hello World')" />

	1.可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性)，如： onclink
	2.注意单双引号的使用：在HTML中我们推荐使用双引号，JS中我们推荐使用单引号
3.可读性差，在 HTML 中编入 JS 大量代码时，不方便阅读
4.特殊情况下使用

1.2、内嵌式JS

<script>
     alert('Hello World!');
</script>

1.3、外部JS

<script src="my.js"></script>

1.利于HTML页面代码结构化，把单独JS代码独立到HTML页面之外，既美观，又方便
2.引用外部JS文件的script标签中间不可以写代码
3.适合于JS代码量比较大的情况

2、JS基本语法

2.1、注释

2.1.1、单行注释

//  单行注释

2.1.2、多行注释

/*
	多行注释
*/

2.2、输入输出语句

方法	说明
alert(msg);	浏览器弹出警示框
console.log(msg);	浏览器控制台打印输出信息
prompt(info);	浏览看弹出输入框，用户可以输入

alert() 主要用来显示消息给用户
console.log() 用来给程序员看自己运行时的消息

2.3、变量

变量是用于存放数据的容器，我们通过变量名获取数据，甚至数据可以修改
本质：变量是程序在内存中申请的一块用来存放数据的空间

2.3.1、变量初始化

var是一个JS关键字，用来声明变量(variable变量的意思)。使用该关键字声明变量后，计算机会自动为变量分配内存空间。
age 是程序员定义的变量名，我们要通过变量名来访问内存中分配的空间

//声明变量同时赋值为18
var age = 18; 
//同时声明多个变量时，只需要写一个 var， 多个变量名之间使用英文逗号隔开。

var age = 18, address ='火影村',salary = 15000;

2.3.2、声明变量特殊情况

情况	说明	结果
var age; console.log(age);	只声明，不赋值	undefined
console.log(age)	不声明不赋值直接使用	报错
age = 10;console.log(age);	不声明只赋值	10