前端开发工程师-前端基础-JavaScript_JavaScript基础语法.docx

PAGE1

PAGE1

JavaScript基础语法入门

1JavaScript语言概述

JavaScript是一种广泛使用的、解释型的脚本语言，主要用于网页的前端开发，以增强网页的交互性和动态效果。它由Netscape公司的BrendanEich在1995年设计，最初被称为LiveScript，随后改名为JavaScript。JavaScript的设计受到了Java和Self语言的影响，它支持面向对象编程、命令式编程和函数式编程风格。

1.1特点

动态性：JavaScript是一种动态语言，变量的类型在运行时确定。

弱类型：变量可以存储任何类型的数据，且类型转换自动进行。

基于对象：虽然JavaScript不是一种纯面向对象的语言，但它支持对象的创建和操作。

事件驱动：JavaScript代码通常在响应用户事件（如点击、滚动等）时执行。

跨平台：JavaScript可以在多种平台上运行，包括浏览器、服务器（Node.js）和移动设备。

1.2历史

JavaScript最初是为了在网页中添加动态效果而设计的，但随着时间的推移，它已经成为一种全栈开发语言，不仅用于前端，也用于后端开发（通过Node.js）和移动应用开发（通过ReactNative等框架）。

2JavaScript与HTML的结合

JavaScript与HTML的结合使得网页能够实现动态内容的更新，响应用户交互，以及执行复杂的客户端逻辑。在HTML中，JavaScript可以通过以下几种方式嵌入：

2.1内联脚本

在HTML元素中直接使用on事件属性，如onclick，来绑定JavaScript代码。

!--内联脚本示例--

buttononclick=alert(Hello,World!)点击我/button

2.2script标签

在HTML文档的head或body部分使用script标签来包含JavaScript代码。

!--使用script标签示例--

script

//文档加载完成后执行

window.onload=function(){

alert(页面加载完成);

}

/script

2.3外部脚本文件

通过script标签的src属性引用外部的JavaScript文件。

!--引用外部脚本文件示例--

scriptsrc=script.js/script

在外部JavaScript文件script.js中：

//script.js

window.onload=function(){

alert(页面加载完成，外部脚本执行);

}

3JavaScript基本数据类型

JavaScript有六种基本数据类型：undefined、null、boolean、number、string和symbol。此外，object虽然不是基本类型，但在JavaScript中占有重要地位。

3.1undefined

表示变量被声明但未赋值。

letx;

console.log(x);//输出：undefined

3.2null

表示一个空值，通常用于表示对象的引用为空。

lety=null;

console.log(y);//输出：null

3.3boolean

表示逻辑值，可以是true或false。

letisTrue=true;

letisFalse=false;

console.log(isTrueisFalse);//输出：false

3.4number

表示数值，包括整数和浮点数。

letintNum=10;

letfloatNum=3.14;

console.log(intNum+floatNum);//输出：13.14

3.5string

表示文本，可以使用单引号或双引号包围。

letsingleQuote=Hello;

letdoubleQuote=World;

console.log(singleQuote++doubleQuote);//输出：HelloWorld

3.6symbol

表示独一无二的值，主要用于对象的键。

letsym1=Symbol(key1);

letsym2=Symbol(key1);

console.log(sym1===sym2);//输出：false

3.7object

表示复杂的数据结构，可以包含属性和方法。

letperson={

name:JohnDoe,

age:30,

greet:function(){

console.log