JavaScript and TypeScript学习总结

#JavaScipt总结
##JavaScript 简介
JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备
###JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。

JavaScript 很容易学习。
##JavaScript 用法
HTML 中的 Javascript 脚本代码必须位于 <script>与 </script>标签之间。

Javascript 脚本代码可被放置在 HTML 页面的 <body>和 <head>部分中。
###<script>标签
如需在 HTML 页面中插入 JavaScript，请使用 <script>标签。

<script>和 </script> 会告诉 JavaScript 在何处开始和结束。

<script>和 </script> 之间的代码行包含了 JavaScript:

<script>
alert("我的第一个 JavaScript");
</script>

###<body>中的 JavaScript

<!DOCTYPE html>
<html>
<body>
.
.
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>");
</script>
.
.
</body>
</html>

###JavaScript 函数和事件
上面例子中的 JavaScript 语句，会在页面加载时执行。

通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。

如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。

您将在稍后的章节学到更多有关 JavaScript 函数和事件的知识。

###在 <head>或者 <body> 的JavaScript
您可以在 HTML 文档中放入不限数量的脚本。

脚本可位于 HTML 的 <body>或 <head> 部分中，或者同时存在于两个部分中。

通常的做法是把函数放入 <head>部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。
###<head> 中的 JavaScript 函数

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
</body>
</html>

###<body>中的 JavaScript 函数

<!DOCTYPE html>
<html>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
<script>
function myFunction()
{
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</body>
</html>

###外部的 JavaScript

<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>

###JavaScript 输出
JavaScript 没有任何打印或者输出的函数
###JavaScript 显示数据
JavaScript 可以通过不同的方式来输出数据：

使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。

###操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。

请使用 “id” 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p id="demo">我的第一个段落</p>

<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>

</body>
</html>

###写到 HTML 文档

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p>我的第一个段落。</p>

<script>
document.write(Date());
</script>

</body>
</html>

###写到控制台
可以使用 console.log() 方法在浏览器中显示 JavaScript 值

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>

##JavaScript 语法
JavaScript 是一个程序语言。语法规则定义了语言结构
###JavaScript 语法
JavaScript 是一个脚本语言。

它是一个轻量级，但功能强大的编程语言。

###JavaScript 字面量
在编程语言中，一般固定值称为字面量，如 3.14。

数字（Number）字面量可以是整数或者是小数，或者是科学计数(e)。
###JavaScript 变量
在编程语言中，变量用于存储数据值。

JavaScript 使用关键字 var 来定义变量，使用等号来为变量赋值：
var x, length

x = 5

length = 6
###JavaScript 操作符
JavaScript使用算术运算符来计算值:

(5 + 6) * 10
JavaScript使用赋值运算符给变量赋值：
x = 5
y = 6
z = (x + y) * 10
###JavaScript 语句
在 HTML 中，JavaScript 语句向浏览器发出的命令。

语句是用分号分隔：

x = 5 + 6;
y = x * 10;
###JavaScript 关键字
JavaScript 关键字用于标识要执行的操作。

和其他任何编程语言一样，JavaScript 保留了一些关键字为自己所用。

var 关键字告诉浏览器创建一个新的变量：
var x = 5 + 6;
var y = x * 10;
###JavaScript 注释
不是所有的 JavaScript 语句都是"命令"。双斜杠 // 后的内容将会被浏览器忽略：
// 我不会执行
###JavaScript 数据类型
JavaScript 有多种数据类型：数字，字符串，数组，对象等等：
var length = 16; // Number 通过数字字面量赋值
var points = x *

JavaScript and TypeScript学习总结

悦读