初识javascript

疏导

次要内容：

学习指标：

节数

知识点

要求

第一节（js的前世今生）

js简介

理解

第二节（js的语法结构）

页面引入js的几种形式

理解

js输入的几种形式

理解

js的语法规定

理解

第三节（Javascript名词解释）

数字字面量

把握

字符串字面量

把握

常量

了解

第四节（Javascript变量命名规定(重点)）

申明变量

把握

变量晋升

把握

变量的命名规定

理解

第五节（Javascript数据类型（重点））

根本数据类型

把握

第六节（Javascript运算符(重点)）

逻辑运算符

把握

什么是语言？

什么是计算机语言？

机器语言，汇编语言，高级语言。

少儿编程语言

计算机存储单位

计算机数据存储是以“字节”（Byte）为单位，数据传输是以大多是以“位”（bit，又名“比特”）为单位，一个位就代表一个0或1（即二进制），每8个位（bit，简写为b）组成一个字节（Byte，简写为B），是最小一级的信息单位。

1B（Byte字节）=8bit，

1KB (Kilobyte 千字节)=1024B，

1MB (Mega byte 兆字节 简称“兆”)=1024KB，

1GB (Giga byte 吉字节 又称“千兆”)=1024MB，

1TB (Tera byte 万亿字节 太字节)=1024GB，其中1024=2^10 ( 2 的10次方)，

1PB（Peta byte 千万亿字节 拍字节）=1024TB，

1EB（Exa byte 百亿亿字节 艾字节）=1024PB，

1ZB (Zetta byte 十万亿亿字节 泽字节)= 1024 EB，

1YB (Yotta byte 一亿亿亿字节 尧字节)= 1024 ZB，

1BB (Bronto byte 一千亿亿亿字节)= 1024 YB，

**Javascript简介
js的前世今生**

JavaScript一种直译式脚本语言，是一种动静类型、弱类型、基于原型的语言，最早是在HTML网页上应用，用来给HTML网页减少动静性能。

动静：在运行时确定数据类型。变量应用之前不须要类型申明，通常变量的类型是被赋值的那个值的类型。

弱类：计算时能够不同类型之间对使用者通明地隐式转换，即便类型不正确，也能通过隐式转换来失去正确的类型。

原型：新对象继承对象（作为模版），将本身的属性共享给新对象，模版对象称为原型。这样新对象实例化后岂但能够享有本人创立时和运行时定义的属性，而且能够享有原型对象的属性。

脚本语言：不须要编译器编译。

在1995年时，由Netscape公司的布兰登·艾奇（Brendan Eich，1961年～），JavaScript的发明人，在网景导航者浏览器（Navigator）上首次设计实现而成。

因为网景公司心愿能在动态HTML页面上增加一些动态效果，于是叫Brendan Eich这哥们在两周之内设计出了JavaScript语言。你没看错，这哥们只用了10天工夫。

为什么起名叫JavaScript？起因是过后Java语言十分红火，所以网景公司心愿借Java的名气来推广，但事实上JavaScript除了语法上有点像Java，其余局部基本上没啥关系。

Netscape在最后将其脚本语言命名为LiveScript，起初Netscape在与Sun单干之后将其改名为JavaScript。

Javascript的三个次要组成部分是：ECMAScript(外围)，DOM（文档对象模型），BOM（浏览器对象模型）。

和Java区别

js的特点

1、是一种解释性脚本语言（代码不进行预编译）。

2、次要用来向HTML（规范通用标记语言下的一个利用）页面增加交互行为。

3、能够间接嵌入HTML页面，但写成独自的js文件有利于构造和行为的拆散。

4、跨平台个性，在绝大多数浏览器的反对下，能够在多种平台下运行（如Windows、Linux、Mac、Android、iOS等

5、它是单线程编程语言。

js在网页中的利用

表单的验证，放大镜，增加购物车等

ECMAScript 和 JavaScript 的关系

1996 年 11 月，JavaScript 的创造者Netscape公司，决定将 JavaScript 提交给标准化组织 ECMA，心愿这种语言可能成为国际标准。

因为网景开发了JavaScript，一年后微软模拟JavaScript开发了JScript，为了让JavaScript成为寰球规范，几个公司联结ECMA（European Computer Manufacturers Association）组织定制了JavaScript语言的规范，被称为ECMAScript规范。

所以简略说来就是，ECMAScript是一种语言规范，而JavaScript是网景公司对ECMAScript规范的一种实现。那为什么不间接把JavaScript定为规范呢？因为JavaScript是网景的注册商标。不过大多数时候，咱们还是用JavaScript这个词。如果你遇到ECMAScript这个词，简略把它替换为JavaScript就行了。

因为JavaScript的规范——ECMAScript在一直倒退，最新版ECMAScript 6规范（简称ES6，有时也被称为ES2015）曾经在2015年6月正式公布了，所以，讲到JavaScript的版本，实际上就是说它实现了ECMAScript规范的哪个版本。

Javascript倒退历史

1995年12月4日 Netscape公司与Sun公司联结公布了JavaScript语言。

1996年03月 Navigator 2.0浏览器正式内置了JavaScript脚本语言。

1997年07月 ECMAScript 1.0公布。

1998年06月 ECMAScript 2.0版公布。

1999年12月 ECMAScript 3.0版公布，成为JavaScript的通行规范，失去了广泛支持。

2007年10月 ECMAScript 4.0版草案公布

2009年12月 ECMAScript 5.0版正式公布

2015年06月 ECMAScript 6正式公布

各个次要浏览器内核和引擎

一个残缺的浏览器蕴含浏览器内核和浏览器的外壳(shell)。浏览器外围——内核分成两局部：渲染引擎和js引擎。

浏览器内核次要指的是浏览器的渲染引擎，2013 年以前，代表有 Trident（IE），Gecko（firefox），Webkit（Safari chrome 等）以及 Presto（opera)。2013 年当前，谷歌开始研发 blink 引擎，chrome 28 当前开始应用，而 opera 则放弃了自主研发的 Presto 引擎，投入谷歌怀抱，和谷歌一起研发 blink 引擎，国内各种 chrome系的浏览器（360、UC、QQ、2345 等等）也纷纷放弃 webkit，投入 blink 的怀抱。

2015年微软推出本人新的浏览器，原名叫斯巴达，后改名edge,应用edge引擎

edge浏览器依然应用Chakra引擎

1、IE浏览器内核：Trident内核，也是俗称的IE内核；

2、Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，当初是Blink内核；

3、Firefox浏览器内核：Gecko内核，俗称Firefox内核；

4、Safari浏览器内核：Webkit内核；

5、Opera浏览器内核：最后是本人的Presto内核，起初是Webkit，当初是Blink内核；

6、360浏览器、猎豹浏览器内核：IE+Chrome双内核；

7、搜狗、漫游、QQ浏览器内核：Trident（兼容模式）+Webkit（高速模式）；

8、百度浏览器、世界之窗内核：IE内核；

9、2345浏览器内核：以前是IE内核，当初也是IE+Chrome双内核；

罕用的IDE介绍

IDE:集成开发环境（Integrated Development Environment ）

Webstorm,visual studio code,sublime,atom,hbuilder,editplus,nodepad等

vscode的应用

js的语法结构

页面引入js的几种形式

第一种形式：外部形式

第二种形式：内部构造

第三种形式：行内形式

js输入的几种形式

1、应用 window.alert() 弹出正告框。

2、应用 document.write() 办法将内容写到 HTML 文档中。

3、应用 innerHTML 写入到 HTML 元素。

4、应用 console.log() 写入到浏览器的控制台。

js的语法规定

1、分号是语句完结的标记，分号不是必须的,咱们不倡议这样做，严格来说，语句要加上分号。

2、 js会疏忽多个空格和换行。

3、字符集

utf-8:对立国内编码，兼容各个国家的语言
gb2312/gbk:简体中文编码

big5:繁体中文编码

4、变量辨别大小写

5、正文

回顾一下html正文：

回顾一下css的正文：

/内容/

js的正文语句

单行正文：//内容

多行正文：/内容/

问：为什么要加正文？

答：为了不便他人也是为了不便本人。

Javascript名词解释

在编程语言中，个别固定值称为字面量，如 3.14。给变量赋值时，等号左边都能够认为是字面量。英语叫做literals，有些书上叫做间接量。

数字字面量

25,98.23
var num = 92;

字符串字面量

‘123’，“Hello”

[12,2,3]

常量

什么是常量？

常量：就是其值不能扭转的。

怎么定义一个常量？

const HOST = “localhost”;

const也是块级作用域

const申明的常量必须初识化，而let申明的变量不必

const实际上保障的，并不是变量的值不得改变，而是变量指向的那个内存地址所保留的数据不得改变。对于简略类型的数据（数值、字符串、布尔值），值就保留在变量指向的那个内存地址，因而等同于常量。但对于复合类型的数据（次要是对象和数组），变量指向的内存地址，保留的只是一个指向理论数据的指针，const只能保障这个指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构是不是可变的，就齐全不能管制了

Javascript变量命名规定（重点）

申明变量

变量是干什么的，是存储数据的，那存储什么品种数据呢？

申明变量应用关键字：var(variable)

你给它赋什么类型的值，那么这个变量就是什么数据类型。

内存中堆区和栈区

独自申明

多个变量申明，两头用逗号隔开

反复申明

脱漏申明

显式申明与隐式申明区别

JS中变量申明分显式申明和隐式申明。

var name = 'muzidigbig';//显式申明

name = 'muzidigbig';//隐式申明（为全局对象（window）的一个属性）

JavaScript 严格模式(use strict)

变量晋升

变量肯定要先申明后应用，如果先应用后申明，js的外部机制天然使变量晋升。

let 和var 的区别

var: variable,它是可变的。

let: 块作用域。

变量名的命名规定

变量的命名：变量是由字母、数字、下划线、$ 组成，但第一个字符必须是字母或者是下划线、$结尾。

$不倡议应用，它可能会和其余的框架语法抵触，或者是函数的名字抵触

1、JavaScript语言的标识符对大小写敏感，所以a和A是两个不同的标识符。

2、首字母能够是任意字母以及美元符号和下划线。残余能够是任意字母，美元符号，下划线和数字

3、不能应用javascript中的关键字(保留字)来命名变量

4、中文也能够申明变量，不倡议应用它。

变量的命名形式

第一种命名：帕斯卡命名（大驼峰式命名）

每个单词的首字符大写。

例如：UserName。

第二种命名：小驼峰式命名

首个单词的首字母小写，其余前面单词的首字母大写。

例如：

例如：userName

第三种命名：匈牙利式命名

数据类型+单词（变量名）

Integer+age

var Iage = 25;

String+address

var Saddress = “西安”;

Javascript数据类型（重点）

数据类型分类：

在此根本的数据类型的根底上又减少了一个根本数据类型：Symbol，Symbol 是 ES6 引入了一种新的原始数据类型，示意举世无双的值。

打印变量的数据类型：typeof

请留神：

NaN 的数据类型是 number

数组(Array)的数据类型是 object

日期(Date)的数据类型为 object

null 的数据类型是 object

未定义变量的数据类型为 undefined

根本数据类型

数字类型(number)

c 语言中：

int(整数),float(单精度浮点型),double(双精度浮点型)，char(字符)

string(字符串)。

二进制(binary)：0b101010101

八进制：0o2535

十六进制：0x69852

进制转换：

toString():十进制转换其余的进制

parseInt():其余的进制转换十进制

最大值：MAX_VALUE

最小值：MIN_VALUE

浮点数不能比拟

NaN:Not a Number：不是一个数值

一些非凡状况（除数为0，最大值变动）

布尔类型（boolean）

true(真),false（假），都是小写的。

TRUE,FALSE,True,False:这些都不正确。

字符串类型(string)

字符串：加单引号或者是双引号

字符串连贯：应用的是+

模板字符串：

undefined

typeof undefined

null

typeof null

null == undefined

null和undefined的区别

1、类型不相等

2、强制类型转换值不一样

var re1 = Number(undefined);//NaNvar re2 = Number(null);//0

3、比拟

null == undefined;//truenull === undefined;//false

援用类型（object）

Javascript运算符(重点)

算术运算符

+，-，，/，%（求余数），++，–，*（求幂数-es7新增）

实例练习：

一元运算符

+（正），-（正数），++，–

两数替换

比拟（关系）运算符

,<,>=,<=,!=,!（不全等）,,===(全等：值和类型都相等)

逻辑运算符

1、&&：逻辑与，所有运算操作数都为真，运算后果才为真

true && true;//truefalse && true;//falsetrue && false;//falsefalse && false;//false

总结阐明：

如果后面的表达式是true,就取前面的值，如果后面的表达式为false,就取后面的值。

2、||：逻辑或，只有运算操作数其中一个为真后果就为真。

true || true;//truefalse || true;//truetrue || false;//truefalse || false;//false

总结阐明：

如果后面的表达式是true,就取后面的值，如果后面的表达式为false,就取前面的值。

3、！：逻辑非,取反运算

例题：

console.log(10 && 'js');//js console.log(0 && 'abc');//0 console.log(10 || 'js');//10 console.log(0 || 'abc');//abc

怎么输入：true和false

console.log(Boolean(0) && Boolean('abc'));

短路问题：输入后果是？

赋值运算符

=,+=,-=,*=,/=,%=

=：赋值

==：比拟（等于）

===：比拟（全等）

条件运算符（三目运算符）

表达式1?表达式2:表达式3

如果表达式1为真(true),计算表达式2的值，如果为假(false),计算表达式3的值。

等性运算符

Null==undefined;//trueNull===undefined;//falsetrue == 1;false ==0;NaN == NaN;//falseNaN !== NaN;//true

运算符的优先级

隐式类型转换

强制类型转换

Number():转化成数值

只有纯数字的能力转换失去实在数字。

布尔类型转换为Number：true 转换为1、false转换为0。

未定义类型转换为Number：underfind 转换为NaN。

空类型转换为Number：null 转换为0。

String()：转化成字符串

Boolean()：转化成布尔

总结阐明：

1. NaN ,0 ,"", ‘’ ,underfind, null 转换为：false。

2. 负数，正数都是:true

3. 只有不是空字符串都是：true

parseInt()：将字符串转化为整数

parseFloat()：将字符串转化为浮点数

作业：

1、变量加var和不加var的区别

2、变量的晋升

3、短路的利用