JavaScript初级学习

1. JavaScript的介绍

前身是LiveScript+JavaScript
JavaScript(js)是一个脚本语言
基于浏览器的脚本语言
基于对象,面向对象的一个编程语言

2. EcmaScript

Ecmascript就是把LiveScript和JavaScript做了合并的一种规范;

我们现在使用的都是EcmaScript5的版本

3. JavaScript的特点

简单、易学、易用、跨平台；
IE、Navigator 符合ECMA（欧洲计算机制造协会）标准，可移植；
事件驱动式的脚本程序设计思想；
动态、交互式的操作方式。

4. JavaScript的用途

交互式操作；
表单验证；
网页特效；
Web游戏
服务器脚本开发等

5. JavaScript的编写工具

vscode
webstorm
....

6. JavaScript的执行平台

浏览器来执行js脚本

7. JavaScript与Java的区别

雷锋雷峰塔
java是面向对象的编程语言,而js是面向对象和基于对象的语言
java是编译型语言,js是解释型语言
java是强类型,js是弱类型语言

8. JavaScript的引入方式

8.1 网页内部编写js代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js的编写</title>

    <!--在网页内部编写js代码-->
    <script type="text/javascript">
        alert("hello")
    </script>
</head>
<body>
</body>
</html>

方便编写,不能达到复用效果
后期的维护变得复杂了
所以生产环境不建议这么来玩

8.2 js的外部引入

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

引入外部的js一定要是script双标签
在script双标签中绝对不能写js代码
script不能互相嵌套

9. javascript的语法格式

JavaScript区分大小写
JavaScript脚本程序须嵌入在HTML文件中；
JavaScript脚本程序中不能包含HTML标记代码
每行写一条脚本语句,如果一行一条语句则可以省略末尾的分号,如果一行写了两条语句,则需要添加分号;

10. js的核心

javascript = ecmascript(js的基础语法)+dom(文档对象模型)+bom(浏览器对象模型)

11. JavaScript中的数据类型

数值(Number)
布尔(Boolean)
字符串值(String)
空值(Null)
未定义(undefined)

12. js中的变量

12.1 什么是变量

变量就是用来在内存中存储数据的;

12.2 如何定义变量

var 变量名称 = 值;

13. js中的标识符

标识符就是给变量方法函数类对象命名的;

数字字母下划线 $组成
不能以数字开头
标识符一定要做到见名知意

14. 常用的命名法(保命指南)

命名法	示例	常用的地方
帕斯卡命名方法(大驼峰命名法)	UserName	类
骆驼命名法(小驼峰命名法)	userName	对象,变量,方法,函数
前缀命名法	mUserName	对象,变量,方法,函数
程序猿命名法(下划线命名法)	user_name	对象,变量,方法,函数

在同一个项目中,尽量选择其中的两种使用
一般建议选择 大驼峰命名法+小驼峰命名法 = 驼峰命名法

15. js中的运算符

数学运算符
```
+ - * /  %
```
关系运算符
```
>  <  >=  <=  ==  ===  !=
```

逻辑运算符

&&:两个表达式都为true时结果才是true
||:只要有一个为true则结果就为true
!: 取反

位运算符(了解)
```
&  |  !  ^  >>  >>>
```
赋值运算符
```
=  +=  -=   *=  /=  %=
```

三元运算符(三目运算符)

布尔表达式?"表达式1":"表达式2";

判断布尔表达式是否成,如果成立,则返回表达式1,否则返回表达式2

自增(++) 自减(--)运算符
```
++
--
```
运算符的优先级

()>!>数学运算符>关系运算符>逻辑运算符>赋值运算符

ps: 当我们无法确定运算符的优先级的时候,我们使用()来控制优先级;

16. 什么是表达式

表达式就是由数字、运算符、括号组成的;
表达式是能求得具体的结果的;

10: 是表达式,是数值表达式
"hello": 是表达式,是字符串表达式
a+b:是表达式 值表达式
a+b>30: 是表达式  值表达式  布尔值表达式  布尔表达式
var a=10(不是表达式);  a=20(是赋值表达式);
var a = 20;不是表达式,(变量的定义不是表达式)
var c = a + b;不是表达式,(变量的定义不是表达式)

17. js中的流程控制

17.1 判断

if...

if(布尔表达式){
    代码块
}
so:判断布尔表达式是否成立,如果成立则执行代码块

if...else...

if(布尔表达式){
    代码块1
}else{
    代码块2
}
so:判断布尔表达式是否成立,如果成立则执行代码快1,否则执行代码快2

if...else if...else

if(布尔表达式1){
    代码块1
}else if(布尔表达式2){
    代码块2
}else{
    代码块3
}
so: 上面的代码块只会执行一个;

17.2 循环

while循环

while(布尔表达式){
    代码块
}

do...while循环

do{
    代码块
}while(布尔表达式);
so: 代码块至少执行一次

for循环

for(变量的定义;循环条件;改变循环条件的表达式){}

break: 中断循环,继续执行后续语句

continue: 结束本次循环,继续下一次循环,ps: continue要慎用,就是要控制好改变布尔表达式值的条件;

17.3 分支

switch(值){
    case 值1:
        代码块1
        break;
    case 值2:
        代码块2
        break;
    case 值3:
        代码块3
        break;
    default:
        代码块4
        break;
}

18. js中的函数

函数: 对功能的封装

函数的要素: 函数名称形参列表函数体返回值

函数的定义:

function 函数名称(形参列表){
    函数体
}

函数的调用:

函数名称(实参)

19. js中的变量的作用域

全局变量: 在全局定义的变量称为全局变量,可以在任意的地方使用
局部变量: 在代码块中定义的变量,只能在其定义的作用域使用

<script>
    var a = 10;  /*全局变量*/
    console.log("-----", a);


    function func1() {
        var name = "admin";
    }

    func1();
    console.log("+++++",name); /*局部变量全局不能使用*/
</script>

<script>
    console.log(a);  /*使用上面script中定义的全局变量*/
</script>

20. js中的数组

数组: 可以存储多个数据的一个集合;

20.1 数组的创建

var ages = new Array(10, 20, 30, 40);  /*定义数组时直接初始化*/
console.log(ages);

var ages1  =  new Array(3);  /*传递一个参数代表的是数组的长度*/
console.log(ages1);

var ages2 =  [];  /*数组的定义,定义一个空数组,建议使用这种方式*/
console.log(ages2);

20.2 修改数组中的元素

var ages = [];
ages[2] = 20;
ages[2] = 10;  /*使用下标修改数组元素*/

posted @ 2021-02-28 21:56 yle 阅读(98) 评论(0) 收藏举报

刷新页面返回顶部

yle