JavaScript编程语言 基础 （1）
问题：什么是web前端javascript
前端：指界面，计算机（PC）软件桌面的界面； 计算机端的浏览器界面； 移动端的软件（app）界面； 移动端的浏览器界面。css
Html+css+JavaScript 使用网页技术（Html，css，JavaScript）开发界面；html
Html，css和JavaScript的关系：
前端
HTML:架构师，网页内容；java
CSS:修饰师：装饰内容。程序员
JavaScript：魔术师，内容网页进行交互。web
关于学习方法：编程没有捷径；只能多写，多记，多理解。express
JavaScript历史：
1. navigator：网景公司，在1995年推出。Livescript很简单的。完成网页中基本的交互能。编程
2. 1995 java很火。Write one，run anywhere！！，写一遍代码，在各个平台运行。后端
3 .网景公司和sun公司合做，推出了javascript。
4. 网景公司，招人，Brendan Eich开发Scheme；开发javascript，像极了java，要比java简单。怄气加赶工，10天开发出了javascript。推出javascript1.0。
5. 1996年时，将javascript1.1提交给了ECMA组织，做为js标准。a)提供标准：ECMAScript标准，javascript是实现了ECMAScript标准的语言。
6. 微软：1996没有浏览器，收购了一家公司，产品：IE，也实现了ECMAScript标准jscript。
7.为期8年的浏览器大战开始。谷歌，火狐，欧鹏，IE safari。
注意：ECMAscript和JavaScript有什么区别？
ECMAscript：语言标准，简称ES，JavaScript是实现了ECMAscript的编程语言。
关于浏览器及其内核
做为前端开发，熟悉四大内核是很是有必要的。四大内核的解析不一样使网页渲染效果更具多样化。下面总结一下各经常使用浏览器所使用的内核。
一、IE浏览器内核：Trident内核，也是俗称的IE内核；
二、Chrome浏览器内核：统称为Chromium内核或Chrome内核，之前是Webkit内核，如今是Blink内核；
三、Firefox浏览器内核：Gecko内核，俗称Firefox内核；
四、Safari浏览器内核：Webkit内核；
五、Opera浏览器内核：最初是本身的Presto内核，后来是Webkit，如今是Blink内核；
六、360浏览器、猎豹浏览器内核：IE+Chrome双内核；
七、搜狗、遨游、QQ浏览器内核：Trident（兼容模式）+Webkit（高速模式）；
八、百度浏览器、世界之窗内核：IE内核；
九、2345浏览器内核：之前是IE内核，如今也是IE+Chrome双内核；
前五个属于主流浏览器。
一些国内的浏览器他们的内核：
搜狗浏览器：兼容模式（IE：Trident）和高速模式（webkit）
傲游浏览器：兼容模式（IE：Trident）和高速模式（webkit）
QQ浏览器：普通模式（IE：Trident）和极速模式（webkit）
360极速浏览器：基于谷歌（Chromium）和IE内核 360安全
什么是JavaScript？
JavaScript是一门脚本语言。弱数据类型，基于对象，基于事件驱动的语言。
Javascript是解释执行的。 解释器是浏览器。
JS特色
(1) 脚本语言。JavaScript是一种解释型的脚本语言，C、C++、java等语言先编译后执行,而JavaScript是在程序的运行过程当中逐行进行解释。
(2)基于对象。JavaScript是一种基于对象的脚本语言,它不只能够建立对象，也能使用现有的对象。
(3)简单。JavaScript语言中采用的是弱类型的变量类型，对使用的数据类型未作出严格的要求，是基于Java基本语句和控制的脚本语言，其设计简单紧凑。
(4)动态性。JavaScript是一种采用事件驱动的脚本语言，它不须要通过Web服务器就能够对用户的输入作出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操做JavaScript均可直接对这些事件给出相应的响应。
(5)跨平台性。JavaScript脚本语言不依赖于操做系统，仅须要浏览器的支持。所以一个JavaScript脚本在编写后能够带到任意机器上使用，前提上机器上的浏览器支持JavaScript脚本语言，目前JavaScript已被大多数的浏览器所支持。
JS应用：
网站后端开发：Node.js让程序员能够用js自由地写后端了。
(2) Web app：HTML5提供了不少API支持，能够实现原生应用拥有的大部分功能，可是性能有待提升。像Firefox OS就是基于web app的移动操做系统。
(3) 混合式应用开发：把原生应用的一部分用前端技术实现，使原生应用更加灵活。不少应用都会这样作。PhoneGap，React Native之类平台的出现容许程序员使用js来进行移动应用开发。
JavaScript的构成：
1. ECMAScript语言基础；（JS基本语法）
(1) JavaScript的历史
(2) ECMAScript标准
(3) 基本语法
(4) 语句
JavaScript 程序的执行单位为行（line），也就是一行一行地执行。通常状况下，每一行就是一个语句。语句（statement）是为了完成某种任务而进行的操做，好比下面就是一行赋值语句。
var x=1+2;复制代码
这条语句先用var命令，声明了变量x，而后将1 + 2的运算结果赋值给变量a
1 + 2叫作表达式（expression），指一个为了获得返回值的计算式。语句和表达式的区别在于，前者主要为了进行某种操做，通常状况下不须要返回值；后者则是为了获得返回值，必定会返回一个值。凡是 JavaScript 语言中预期为值的地方，均可以使用表达式。好比，赋值语句的等号右边，预期是一个值，所以能够放置各类表达式。
语句以分号结尾，一个分号就表示一个语句结束。多个语句能够写在一行内。
var x=1+2; var y=1+3;复制代码
分号前面能够没有任何内容，JavaScript引擎将其视为空语句。
;;;复制代码
上面的代码就表示3个空语句。
表达式不须要分号结尾。一旦在表达式后面添加分号，则 JavaScript 引擎就将表达式视为语句，这样会产生一些没有任何意义的语句。
1+2;
"abc";复制代码
上面两行语句只是单纯地产生一个值，并无任何实际的意义。
语句分为条件语句和 循环语句，
条件语句：JavaScript 提供if结构和switch结构，完成条件判断，即只有知足预设的条件，才会执行相应的语句。
if 语句，if else 语句，
switch 语句，
多个if...else连在一块儿使用的时候，能够转为使用更方便的switch结构。
switch (fruit) {
case "banana":
// ...
break;
case "apple":
// ...
break;
default:
// ...
}
复制代码
上面代码根据变量fruit的值，选择执行相应的case。若是全部case都不符合，则执行最后的default部分。须要注意的是，每一个case代码块内部的break语句不能少，不然会接下去执行下一个case代码块，而不是跳出switch结构。
三元运算符，
JavaScript 还有一个三元运算符（即该运算符须要三个运算子）?:，也能够用于逻辑判断。
(条件) ? 表达式1 : 表达式2
复制代码
上面代码中，若是“条件”为true，则返回“表达式1”的值，不然返回“表达式2”的值。
var even = (n % 2 === 0) ? true : false;
复制代码
上面代码中，若是n能够被2整除，则even等于true，不然等于false。它等同于下面的形式。
var even;
if (n % 2 === 0) {
even = true;
} else {
even = false;
}
复制代码
这个三元运算符能够被视为if...else...的简写形式，所以能够用于多种场合。
var myVar;
console.log(
myVar ?
'myVar has a value' :
'myVar does not have a value'
)
// myVar does not have a value
复制代码
上面代码利用三元运算符，输出相应的提示。若是过变量有 value 值，输出？前面的值，若是没有值，输出后面的值。
var msg = '数字' + n + '是' + (n % 2 === 0 ? '偶数' : '奇数');
复制代码
上面代码利用三元运算符，在字符串之中插入不一样的值。
(5) 变量
1.概念：变量是对“值”的具名引用。变量就是为“值”起名，而后引用这个名字，就等同于引用这个值。变量的名字就是变量名。（变化的量，在JS程序中，用于存储数据的容器。）
2.如何在JS程序中使用变量？
a) 声明变量：告诉浏览器，我要使用这个变量；var 变量名称;//这是声明变量的语法。
b) 初始化变量：给变量赋值；
变量名称=值; //=;赋值，将值存储到变量中；
赋值操做：将等号右边的值（能够是变量）赋值给左边的变量；
c) 声明并初始化变量
var 变量名称=值；
注意：变量使用以前必需要声明；
只声明不赋值，系统给变量默认值：undefined；
变量名称用于到内存中存储数据或者是取数据；
d) 定义多个变量;
var a,b,c; 即var 变量名称，变量，变量
e) 关键字和保留字
关键字：在JS程序中，有特定含义的单词；
保留字：在JS程序中，与特定含义的单词，可是尚未被JS程序使用。
标识符命名规范：
- 标识符由字母，数字，下划线，$构成；
- 标识符的首字母不能为数字：
var 8a；//错误 - 标识符不能为关键字或者是保留字；
var var; //错误 - 约定俗称：标识符要见名知意；
- 约定俗成：标识符要使用驼峰式命名；变量使用小驼峰（第一个单词首字母小写）;
getElementById //小驼峰 GetElementById //大驼峰
- JS严格区分大小写。
(6) 数据类型 typeOf()
基本数据类型：typeof()变量，获取变量的数据类型；
a) 数字类型： 整数：十进制：0-9 ； 浮点数（小数）
b) 字符串类型：用单引号或者双引号括起数据，字符串，由字符（文本）构成；
c) 布尔类型：用于判断 true:真 false:假
d) 特殊类型
- null：表明空值，通常清除资源的时候用，初始化变量；
- undefined：表明变量未初始化；
- NaN：Not a Number 不是一个整数，非数字之间的运算，结果为NaN；
- isNaN(s)判断是否NaN（不是数字）,若是该字符里不是全数字，则返回true；若是是全数字，则返回false。
a)数组 b) 对象（函数）
(7) 运算符
a) 加法运算符 基本规则：（+）是最多见的运算符，用来求两个数值的和。1+1 //2
JavaScript 容许非数值的相加 true+true //2 1+true //2
上面代码中，第一行是两个布尔值相加，第二行是数值与布尔值相加。这两种状况，布尔值 都会自动转成数值，而后再相加。
比较特殊的是，若是是两个字符串相加，这时加法运算符会变成链接运算符，返回一个新的字 符串，将两个原字符串链接在一块儿。
"a"+"bc" //"abc"复制代码
若是一个运算子是字符串，另外一个运算子是非字符串，这时非字符串会转成字符串，再链接在 一块儿。
1+"a" //"1a"
false+"a" //"false"复制代码
加法运算符是在运行时决定，究竟是执行相加，仍是执行链接。也就是说，运算子的不一样，导 致了不一样的语法行为，这种现象称为“重载”（overload）。因为加法运算符存在重载，可 能执行两种运算，使用的时候必须很当心。
"3"+4+5 //"345"
3+4+"5" //"75"复制代码
除了加法运算符，其余算术运算符（好比减法、除法和乘法）都不会发生重载。它们的规则 是：全部运算子一概转为数值，再进行相应的数学运算。
对象的相加 若是运算子是对象，必须先转成原始类型的值，而后再相加
b) 包括加法运算符在内，JavaScript 共提供10个算术运算符，用来完成基本的算术运算。
- 加法运算符：
x + y
- 减法运算符：
x - y - 乘法运算符：
x * y - 除法运算符：
x / y - 指数运算符：
x ** y - 余数运算符：
x % y - 自增运算符：
++x或者x++ - 自减运算符：
--x或者x-- - 数值运算符：
+x - 负数值运算符：
-x
余数运算符（%）返回前一个运算子被后一个运算子除，所得的余数。须要注意的是，运 算结果的正负号由第一个运算子的正负号决定
-1%2 //-1
1%-2 //1复制代码
因此，为了获得负数的正确余数值，能够先使用绝对值函数。
c) 关系运算符 用于比较两个值的大小，而后返回一个布尔值，表示是否知足指定的条件。
注意，比较运算符能够比较各类类型的值，不只仅是数值。JavaScript 一共提供了8个比较运算符。
<小于运算符>大于运算符<=小于或等于运算符>=大于或等于运算符==相等运算符（只判断值是否相等）===严格相等运算符（判断值和数据类型，叫全等或恒等）!=不相等运算符!==严格不相等运算符
d) 赋值运算符（Assignment Operators）用于给变量赋值。最多见的赋值运算符，固然就是等号（=）var x=1; var x=y;
赋值运算符还能够与其余运算符结合，造成变体。下面是与算术运算符的结合。
x=x+y; <=> x+=y;
x=x-y; <=> x-=y;
x=x*y; <=> x*=y;
x=x/y; <=> x/=y;
x=x%y; <=> x%=y;
x=x**y; <=> x*=y;复制代码
e) 逻辑运算符
布尔运算符用于将表达式转为布尔值，一共包含四个运算符。
- 取反运算符：
! - 且运算符：
&& - 或运算符：
|| - 三元运算符：
?:
(8) 函数
(9) 数组
(10) 字符串
(11) 做用域
(12) 原形
(13) 闭合
(14) JS面向对象设计
2. DOM（文档对象模型）：对网页的操做，即对浏览器（可看作容器）内的内容进行操做
DOM: Document 整篇文档 Object 文档对象 Model 模型
（选项卡，轮播图，更改文档结构，购物车，楼梯导航；这些是DOM里边最基础的）
Dom树（层级嵌套）
3. BOM（浏览器对象模型）：对浏览器自己进行操做。
Browser Object Model
编写JavaScript程序
1. 全部的js程序都要写在script标签中
2. console.log(“输出的信息”)
a) 输出的信息要用引号括起来 b) 每写完一条语句，要以分号结束
c) 编程中用到的标点符号，都要使用英文的。
3. script标签：嵌入js代码
a) script标签能够写在html中的任何地方，而且html中能够有多个script标签
b) html中的代码：都是从上往下逐条执行。
c) script标签中经常使用的属性：
i. type：规定脚本语言的类型，text/javascript
ii. src:资源所在的路径，引入外部的js文件，script中添加的代码被忽略。
4. 弹出框提示：
window.alert(“提示信息”)：使用窗口的提示框功能输出提示信息。
注： a) alert阻塞以后的代码执行。 b) window能够省略。
c) alert中提示信息的换行
5. 单双引号： 在提示信息中，显示引号；内部使用双引号，外部使用单引号；
console.log('"职位介绍"'); console.log("<input type='text' />");
6. 往网页中输出内容：（HTML代码）
a) document.write(“html代码”)：将html代码写入到网页中。
i. document:文档，全部的页面都是文档，能够认为是网页
i. write:写
7. 1. confirm(“提示信息”):出现一个确认框（提示信息、确认按钮、取消按钮）;
a) 提示用户是否肯定对信息的操做。
避免用户误操做当点击肯定的时候，返回一个确认的结果true(真)
当点击取消的时候，返回一个取消的结果false(假)
confirm("肯定删除吗?");//返回真或者假
console.log(confirm("肯定删除吗?"));
8. prompt(“提示信息”)：出现一个输入框，提示用户输入信息的。开发时不用。
9. javascript注释：被浏览器忽略不执行的内容。
a) 用来讲明代码的功能
b) 两种注释方式： i.单行注释：// i.多行注释：/* */
- 1. JavaScript语言基础
- 2. javascript编程基础1
- 3. python编程语言基础
- 4. C 语言编程基础
- 5. C语言--编程语言的基础
- 6. Python语言编程基础
- 7. java编程语言基础
- 8. 『Python基础-1 』 编程语言Python的基础背景知识
- 9. 汇编语言-----（1）基础知识
- 10. 汇编语言-1-基础知识
- 更多相关文章...
- • R 语言基础 - R 语言教程
- • Kotlin 基础语法 - Kotlin 教程
- • Kotlin学习（一）基本语法
- • ☆基于Java Instrument的Agent实现
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. JavaScript语言基础
- 2. javascript编程基础1
- 3. python编程语言基础
- 4. C 语言编程基础
- 5. C语言--编程语言的基础
- 6. Python语言编程基础
- 7. java编程语言基础
- 8. 『Python基础-1 』 编程语言Python的基础背景知识
- 9. 汇编语言-----（1）基础知识
- 10. 汇编语言-1-基础知识