javascript基础入门案例,javascript基础入门书籍

大家好，给大家分享一下javascript基础入门案例，很多人还不知道这一点。下面详细解释一下。现在让我们来看看！

JavaScript基础知识汇总

1、js的简介
JavaScript 是⼀种客户端脚本语⾔（脚本语⾔是⼀种轻量级的编程语⾔，语法和java类似。
JavaScript 通常被直接嵌⼊ HTML ⻚⾯，由浏览器解释执⾏
JavaScript 是⼀种解释性语⾔（就是说，代码执⾏不进⾏预编译）快码论文。
特点：弱类型和基于对象。(因为⾯向对象需要具有封装、继承、多态的特征)
JavaScript语⾔中包含三个核⼼：ECMAScript基本语法、DOM、BOM

2、 前端Web技术的组成
HTML、CSS、JavaScript
1)HTML是⼀种标记语⾔，⽤来结构化我们的⽹⻚内容并赋予内容含义，例如定义段落、标题和数据表，或在⻚⾯中嵌⼊图⽚和视频。
2)CSS 是⼀种样式规则语⾔，可将样式应⽤于 HTML 内容， 例如设置背景颜⾊和字体，在多个列中布局内容。
3)JavaScript 是⼀种脚本语⾔，可以⽤来创建动态更新的内容，控制多媒体，制作图像动画，还有很多。

3、js的使用方法
可以像添加CSS那样将 JavaScript 添加到 HTML ⻚⾯中。CSS 使⽤ 元素链接外部样式表，使⽤

< type="text/java" src="my.js"></>

4、JS的基础语法
1）JS的输出：常用的方式有两种：
document.write() ⽅法将内容写到 HTML ⽂档中
console.log() 写⼊到浏览器的控制台
还有两种不经常使用
window.alert() 弹出警告框
innerHTML 写⼊到 HTML 元素

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>JavaScript实例</title>
 </head>
 <body>
 <h3>测试JavaScript的输出</h3>
 <div id="did">div层</div>
 </body>
 <>
 //弹出⼀个信息提示框
 window.alert("Hello JavaScript!");
 
 //输出到浏览器⻚⾯中
 document.write("这个是⻚⾯中的输出");
 //通过写⼊HTML标签中，完成⻚⾯中的输出
 document.getElementById('did').innerHTML="div层中的输出";
 //控制台上的输出
 console.log("控制台上的输出");
 </>
</html>

2）变量的声明，命名规则和规范
使⽤var声明变量；

命名规则：
由字⺟、数字、下划线、$符号组成，不能以数字开头
不能是关键字和保留字，例如：for、 if、while。
区分⼤⼩写
命名规范：
变量名必须有意义，最好见名知意。
遵守驼峰命名法。⾸字⺟⼩写，后⾯单词的⾸字⺟需要⼤写。例如：userName、userPassword

语句的注释
脚本注释： // 单⾏注释 和 /* 多⾏注释 */

5 JS中的数据类型
和JAVA语言类似，分为基本数据类型和引用数据类型
值类型(基本类型)：
字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
注意：Symbol 是 ES6 引⼊了⼀种新的原始数据类型，表示独⼀⽆⼆的值。
引⽤数据类型： 对象(Object)、数组(Array)、函数(Function)。

利用typeof操作符获取一个变量的类型
undefined - 如果变量是 Undefined 类型的
boolean - 如果变量是 Boolean 类型的
number - 如果变量是 Number 类型的 (整数、浮点数)
string - 如果变量是 String 类型的 （采⽤""、 ‘’）
object - 如果变量是⼀种引⽤类型或 Null 类型的 如： new Array()/ new String()…
function – 函数类型

typeof "zhangsan" // 返回 string
typeof 3.14 // 返回 number
typeof NaN // 返回 number
typeof true // 返回 boolean
typeof [10,20,30,40] // 返回 object
typeof {name:'lisi', age:20} // 返回 object
typeof new Date() // 返回 object
typeof function(){} // 返回 function
typeof myCar // 返回 undefined (如果 myCar 没有声明)
typeof null // 返回 object

类型转换
JavaScript 变量可以转换为新变量或其他数据类型：

ECMAScript 中可⽤的 3 种强制类型转换如下：
 Boolean(value) - 把给定的值转换成 Boolean 型；
 Number(value) - 把给定的值转换成数字（可以是整数或浮点数）；
 String(value) - 把给定的值转换成字符串；
 使⽤：Number（）、parseInt() 和parseFloat（） 做类型转换
 Number()强转⼀个数值(包含整数和浮点数)。
 *parseInt()强转整数，
 *parseFloat（）强转浮点数
 
 函数isNaN()检测参数是否不是⼀个数字。 is not a number

6 JS中的运算符
主要通过运算符优先级的高低来了解所有常见的运算符

优先级从⾼到底
1. () 优先级最⾼
2. ⼀元运算符 ++ -- !
3. 算数运算符 先 * / % 后 + -
4. 关系运算符 > >= < <=
5. 相等运算符 == != === !==
6. 逻辑运算符 先 && 后||
7. 赋值运算符 = += -= *= /= %=

7 JS流程控制
在任何⼀⻔程序设计语⾔中，都需要⽀持满⾜程序结构化所需要的三种基本结构:
顺序结构
分⽀结构（选择结构）
循环结构
1）分支语句
if 语句 - 只有当指定条件为 true 时，使⽤该语句来执⾏代码
if…else 语句 - 当条件为 true 时执⾏代码，当条件为 false 时执⾏其他代码
if…else if…else 语句 - 使⽤该语句来选择多个代码块之⼀来执⾏
switch…case 语句 （不写break会有穿透的效果）- 使⽤该语句来选择多个代码块之⼀来执⾏
2）循环结构
for - 循环代码块⼀定的次数
for/in - 循环遍在这里插入代码片历对象的属性（举例讲解）

var ob = {"name":"张三","age":22,"sex":"男"};
//遍历对象ob中的每个属性
for(key in ob){
 //输出属性和对应的属性值
 console.log(key+":"+ob[key]);
}
/*
//输出结果：
name:张三
age:22
sex:男
*/

while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块

循环中的 break break 和 continue continue 语句
break 语句⽤于跳出循环。
continue ⽤于跳过循环中的⼀个迭代。

8 JS函数
函数（function）是⼀段完成指定任务的已命名代码块。函数可以遵照给它的⼀组值或参数完成特定的任务，并且可能返回⼀个值。

函数的优越性：
控制程序设计的复杂性
提⾼软件的可靠性
提⾼软件的开发效率
提⾼软件的可维护性
提⾼程序的重⽤性
常见的三种定义函数方法
1）function 函数名（[参数列表…]）{
函数体。。。
[return 返回值;]
}
2）使⽤Function()构造函数来定义函数
3）var 函数名 = function(参数1，参数2，…){函数体};