JavaScript自学笔记（一）

最新推荐文章于 2024-07-12 16:27:40 发布

PlusOneOneOne

最新推荐文章于 2024-07-12 16:27:40 发布

阅读量183

点赞数 1

分类专栏： JS自学笔记文章标签： javascript es6

本文链接：https://blog.csdn.net/PlusOneOneOne/article/details/114480757

版权

JS自学笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JavaScript（简称“JS”）是一种描述网页行为的动态脚本语言，在最新的版本中，JavaScript由ECMAScript（描述该语言的语法和基本对象）+DOM（文档对象模型，描述处理网页内容的方法和接口）+BOM（浏览器对象模型，描述与浏览器进行交互的方法和接口），支持面向对象、命令式和声明式（如函数式编程）风格，可以插入HTML页面的编程代码。

那么，我们不妨简单粗暴的直接从实例来开始对JavaScript的学习。

实例1：显示日期

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>尝试JavaScript</title>

  <script>
    function displayDate() {
      document.getElementById("demo").innerText=Date();
    }
  </script>
</head>

<body>
<label id="demo">This is a demo</label>
<button onclick="displayDate()">show the date</button>
</body>
</html>

其实从上面的代码段很容易就能看出来JavaScript结构，如下：

<!DOCTYPE html>
<head>
	<meta charset="UTF-8"/>
	<title>我是JavaScript</title>
	<script>
		//内容
	</script>
	//script内容放在head或者body直接放在html体中都可以
</head>
<body>
	//组件
</body>
</html>

JS用法

< script >标签

< script >和< /script >会告诉我们JavaScript的开始与结束，这一对标签中的代码行包含了JavaScript，我们通常会把JavaScript代码放在< head >或者页面底部，使得代码集中且直观。

<script>
	alter("我的JavaScript");
</script>

JS输出

数据的显示

window.alter() ----- 警告框
ducument.write() ----- 内容写入HTML文档
innerHTML ----- 写入到HTML元素
console.log ----- 写入浏览器控制台

JS语法

字面量

数字（Number）
整数、小数或科学计数（e）
字符串（String）
可以使用单引号（'')或双引号（""）
“JavaScript”,‘JavaScript’
表达式
3 * 6
数组（Array）
[40, 100, 1, 5, 25, 10]
对象（Object）
{firstName:"Java",lastName:"Script",num:20}
函数（Function）
function myFunction(a, b){ return a * b; }

JavaScript变量
JavaScript中常使用关键字var来定义变量，等号（=）来赋值。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
<label id="demo"></label>
</body> 
<script>
  var length;
  length = 6;
  document.getElementById("demo").innerHTML = length;
</script>
</html>

注释
在双斜杠//后的语句通常在运行时会被浏览器忽略

1.//我不会执行，我是单行注释
2.
/*
我是多行注释
我也不会执行
*/
3.HTML注释
<-- -->

数据类型

var length = 16; //Number通过数字字面量赋值
var points = x * 10; //Number通过表达式字面量赋值
var lastName = “JavaScript” //String通过字符串字面量赋值
var cars = [“a”,“b”,“c”];//Array通过数组字面量赋值
var person = {fistName:“Java”,lastName:“Script”};//Object通过对象字面量赋值

从这些来看，其实Javascript大多数语法与数值类型以及用法和Java相似，只不过在使用JavaScript大家需要结合网页中的组件使用来创造相应的事件。

我们在使用JavaScript时的主要目的其实就在于对浏览器事件做出响应，读写页面中的HTML元素，或是在数据被提交到服务器之前验证数据，也可以结合Node.js技术进行服务器端编程，当然这是后话。

PlusOneOneOne

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
JavaScript自学笔记（一）

JavaScript自学笔记（一）JavaScript（简称“JS”）是一种描述网页行为的动态脚本语言，支持面向对象、命令式和声明式（如函数式编程）风格，可以插入HTML页面的编程代码。那么，我们不妨直接从实例来开始对JavaScript的学习。实例1：显示日期<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>尝试JavaScript</
复制链接

扫一扫