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; /*使用下标修改数组元素*/
JavaScript初级学习的更多相关文章
- Javascript初级学习总结
首先,在Html页面输出,使用document.write('内容'); <html> <head> <title></title> <scrip ...
- 大量Javascript/JQuery学习教程电子书合集
［推荐分享］大量Javascript/JQuery学习教程电子书合集,送给有需要的人 不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小 15天学会jQuery(完整版).pd ...
- ［推荐分享］大量Javascript/JQuery学习教程电子书合集，送给有需要的人
不收藏是你的错^_^. 经证实,均可免费下载. 资源名称 资源大小 15天学会jQuery(完整版).pdf 274.79 KB 21天学通JavaScript(第2版)-顾宁燕扫描版.pdf ...
- webpack 4.x 初级学习记录
首先声明下,本人不擅长文字表达,文采不行,所以文章中文字较少,请看代码,初级学习,不足之处请多多指教 GitHub链接 看云kancloud [TOC] webpack 4.x 安装 首先需要在全局中 ...
- 正则表达式（javascript）学习总结
正则表达式在jquery.linux等随处可见,已经无孔不入.因此有必要对这个工具认真的学习一番.本着认真.严谨的态度,这次总结我花了近一个月的时间.但本文无任何创新之处,属一般性学习总结. 一.思考 ...
- JavaScript 基础学习1-day14
JavaScript 基础学习1 知识预览JavaScript概述二 JavaScript的基础三 JavaScript的对象BOM对象DOM对象实例练习js扩展 JavaScript概述 JavaS ...
- JavaScript正则表达式学习笔记(二) - 打怪升级
本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...
- 初步总结javascript中学习DOM之前的知识
嘿嘿,又到了周末时间,周六其实就是总结这周的学习的,记得周二周三刚开始接触javascript时间,还是不知道怎么学习的,就感觉找不到方向,那时间学习的只是总结了一些简单的定义或者是学习结构,今天就把 ...
- JavaScript紧凑学习
JavaScript紧凑学习 windows本地,调用命令行: win键+R 键入cmd , (cmd是Command 命令行 简称) 目录是C盘下的 C:\Users\Administrator&g ...
随机推荐
- Windows环境下Robot Framework 下载及安装流程
1.安装包下载 注意安装包统一64位或32位 1)python-2.7.16.amd64.msi 2)robotframework-3.0.2.tar.gz 3)robotframework-ride ...
- python3基本数据类型补充
列表 list 有序,可嵌套,可重复,元素可修改 方括号 占用空间小但时间消耗比较大 mylist=["kimi",1,1,1,["amy",18]] V=my ...
- IDEA 安装常用操作一
关于IDEA的下载,破解自行百度 一.安装完成的常用设置 SDK选择.编译版本的选择,单项目选择,全局选择 maven配置,单项目,全局配置 二.IDEA如何安装lombok https://www. ...
- Linux 驱动框架---i2c驱动框架
i2c驱动在Linux通过一个周的学习后发现i2c总线的驱动框架还是和Linux整体的驱动框架是相同的,思想并不特殊比较复杂的内容如i2c核心的内容都是内核驱动框架实现完成的,今天我们暂时只分析驱动开 ...
- html+ashx + NPOI 实现导出Excel文件并且预览和下载
先看看实现效果 简单描述一下实现过程: 1. 生成报表,返回报表文件路径 $.post 请求一般处理文件ashx ,通过npoi生成对应的excel文件.生成成功后,返回文件保存的完整路径 2. ...
- Code Spell Checker & VSCode 单词拼写验证
Code Spell Checker & VSCode 单词拼写验证 https://marketplace.visualstudio.com/items?itemName=streetsid ...
- Apple iOS 触控按钮 自动关闭 bug
Apple iOS 触控按钮 自动关闭 bug bug 轻点 iPhone 背面可执行操作 您可以轻点两下或轻点三下 iPhone 背面以执行某些操作,如向上或向下滚动.截屏.打开"控制中心 ...
- git-reset All In One
git-reset All In One git 撤销 merge $ git checkout feature-sentry $ git pull $ git checkout dev $ git ...
- 手机 wifi 已连接，不可上网 bug
手机 wifi 已连接,不可上网 bug 同一个 Wi-Fi,电脑却可以? 注意事项 Mac 共享热点支持有线连接.蓝牙连接的网络进行共享. 如果你的 Mac 本身是通过 wifi 来连接上网的,那就 ...
- Angular Routing
Angular Routing v9.0.7 https://angular.io/start/start-routing