【JAVAWEB】JavaScript基础知识

目录

1.认识JavaScript

1.1JavaScript是什么

1.2JavaScript和html,css的关系

1.3JavaScript的组成

2.JavaScript的前置知识

2.1JavaScript的书写形式

行内式

内嵌式

外部式

2.2注释

2.3输入输出

3.JavaScript的语法知识

3.1变量的使用

创建变量

使用变量

3.2动态类型

4.基本数据类型

4.1number数字类型

4.2String字符串类型

4.3boolean布尔类型

4.4undefined未定义数据类型

4.5null空值类型

---

1.认识JavaScript

1.1JavaScript是什么

JavaScript ( 简称 JS)

• 是世界上最流行的编程语言之一
• 是一个脚本语言, 通过解释器运行
• 主要在客户端(浏览器)上运行, 现在也可以基于 node.js 在服务器端运行

JavaScript 的能做的事情 :

• 网页开发(更复杂的特效和用户交互)
• 网页游戏开发
• 服务器开发(node.js)
• 桌面程序开发(Electron, VSCode 就是这么来的)
• 手机 app 开发

1.2JavaScript和html,css的关系

• HTML: 网页的结构(骨)
• CSS: 网页的表现(皮)
• JavaScript: 网页的行为(魂)

1.3JavaScript的组成

• ECMAScript(简称 ES): JavaScript 语法（一套标准）
• DOM: 页面文档对象模型, 对页面中的元素进行操作
• BOM: 浏览器对象模型，对浏览器敞口进行操作

光有JS语法，只能写一些基础的逻辑流程。

但是要想完成更复杂的任务，完成和浏览器以及页面的交互，那么就需要DOM API和BOM API。

注意：这主要指在浏览器端运行的 JS. 如果是运行在服务端的 JS , 则需要使用 node.js 的 API, 就不太需要关注 DOM 和 BOM

2.JavaScript的前置知识

2.1JavaScript的书写形式

行内式

直接嵌入到HTML的元素内部。

<input type = "button" value = " 点我一下 " onclick = "alert('haha')" >

注意 ,：JS 中字符串常量可以使用单引号表示 , 也可以 使用双引号表示 .

            HTML 中推荐使用双引号, JS 中推荐使用单引号 .

内嵌式

写到script标签中。

<script>

    alert ( "haha" );

</script>

外部式

写到单独的.js文件中。

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

alert ( "hehe" );

注意 ： 这种情况下 script 标签中间不能写代码 . 必须空着 ( 写了代码也不会执行 ).

           适合代码多的情况.

2.2注释

单行注释 //

多行注释 /* */

使用 ctrl + / 切换注释 .

多行注释不能嵌套 . 形如这种代码就会报错

/*
/*
   我是多行注释
   我是多行注释
   我是多行注释
*/
*/

2.3输入输出

输入：prompt（弹出一个输入框）

prompt("请输入您的姓名:");

输出：alert（弹出一个警示对话框，输出结果）

alert("hello");

输出：consolo.log（在控制台打印一个日志，供程序员查看）

console.log("这是一条日志");

3.JavaScript的语法知识

3.1变量的使用

创建变量

var name = 'zhangsan';
var age = 20;

var是JS中的关键字，表示这是一个变量。

使用变量

变量要先声明再使用。

var name = prompt("请输入姓名:");
var age = prompt("请输入年龄:");
var score = prompt("请输入分数");
alert("您的姓名是: " + name);
alert("您的年龄是: " + age);
alert("您的分数是: " + score);

3.2动态类型

1) JS 的变量类型是程序运行过程中才确定的 ( 运行到 = 语句才会确定类型 )

var a = 10 ;     // 数字

var b = "hehe" ; // 字符串

2) 随着程序运行 , 变量的类型可能会发生改变 .

var a = 10 ;     // 数字

a = "hehe" ;     // 字符串

4.基本数据类型

4.1number数字类型

JS中不区分整数和浮点数，统一使用“数字类型”来表示。

数字进制表示：

var a = 07 ;       // 八进制整数 , 以 0 开头

var b = 0xa ;     // 十六进制整数 , 以 0x 开头

var c = 0b10 ;     // 二进制整数 , 以 0b 开头

4.2String字符串类型

与java类似，这里不做详解。

4.3boolean布尔类型

表示“真”和“假”。Boolean参与运算时当作1和0来看待。

4.4undefined未定义数据类型

如果一个变量没有被初始化过，结果就是undefined，是undefined类型。

var a ;

console . log ( a )

undefined 和字符串进行相加 , 结果进行字符串拼接

console . log ( a + "10" );   // undefined10

undefined 和数字进行相加 , 结果为 NaN

console . log ( a + 10 );

4.5null空值类型

null表示当前的变量是一个“空值”

var b = null ;

console . log ( b + 10 );     // 10

console . log ( b + "10" );   // null10

注意 :

null 和 undefined 都表示取值非法的情况 , 但是侧重点不同 .

null 表示当前的值为空 . ( 相当于有一个空的盒子 )

undefined 表示当前的变量未定义 . ( 相当于连盒子都没有）