初识JavaScript

什么是JavaScript?

• JavaScript是世界上最流行的语言之一，是一种运行在客户端脚本的语言
• 脚本语言：不需要编译，运行过程由js解释器逐行来进行解释并执行
• 现在也可以基于Node.js技术进行服务器端编程

JavaScript的发展历史

• 布兰登.艾奇（1961年---）
• 在1995年利用10天完成JavaScript设计
• 网景公司最初命名为LiveScript,后来在与Sun合作之后将其改名为JavaScript.

 

 

JavaScript作用

• 表单验证（js产生最初的目的）
• 网页特效
• 服务端开发（Node.js）
• 桌面程序（Electron）
• APP（Cordova）
• 控制硬件-物联网（Ruff）
• 游戏开发（cocos2d-js）

HTML/CSS/JS的关系

HTML/CSS标记语言--描述类语言

• HTML决定网页结构和内容，相当于人的身体
• css决定网页呈现给用户的模样，相当于给人穿衣服、化妆

js脚本语言--编程类语言

实现业务逻辑和页面控制，相当于人的各种动作 

浏览器执行JavaScript的原理

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

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

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

JavaScript由那三部分组成？

ECMAScript（JavaScript语法）

JavaScript网景公司

Jscript微软公司

DOM(页面文档对象模型)

是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过DOM提供的接口可以对页面上的各种元素进行操作

BOM（浏览器对象模型）

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

 JavaScript三种书写位置

1.行内式--直接写到元素内部

<input type="button" value="唐伯虎" onclick="alert('秋香')">

 

2.内嵌式

<script>
    alert('Hello JS');
</script>

 

 

3.外部式

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

 

alert('我是外部引入文件')

 

 JavaScript注释

1.单行注释(ctrl+/)

<script>
    // alert("Hello JS");
</script>

2.多行注释(shift+alt+a)

/*alert("我是外部引入文件")
alert("你好")*/

JavaScript三个输出语句

 1.alert()        浏览器弹出警示框

<script>
    alert('你的年龄是')
</script>

 

 

2.console.log()        控制台打印输出

<script>
    console.log('我是程序员能看到的')
</script>

 

 

3.prompt()        弹出输入框

<script>
    prompt('请输入你的年龄')
</script>