js01

web 开发

前端

       HTML 数据显示,负责内容

       css     页面美化,负责样式

       js        页面特效,与用户交互,负责行为

后端

       PHP  /  JAVA  /  asp.net / python / Ruby /  node.js /

----------------------------------------------------------------------------------------------------------------

1. javascript 简介
1.1 什么是javascript
1.1.1 概念: javascript是 基于对象 和 事件驱动 并具有相对安全性的 客户端 脚本语言
1.1.2 发展简史:
① Nombas公司1992年开发 嵌入式脚本语言 C-- 后改名 ScriptEase
② Netscape公司 1995年发布LiveScript 后改名javascript1.0
③ 三足鼎立 NetScape推出javascript1.1后,Microsoft推出Jscript, 加上 ScriptEase
④ 标准化 1997javascript1.1 作为草案 提交给 ECMA(欧洲计算机制造商协会) 。由来自 Netscape、Sun、
微软、Borland 和其他一些对脚本编程感兴趣的公司的程序员组成的 TC39 锤炼出了 ECMA-262,该标准
定义了名为 ECMAScript 的全新脚本语言.

--------------------------------------------------------------------------------------------------------------------

1.1.3 组成: 核心(ECMAScript)浏览器对象模型(BOM) 文档对象模型(DOM)
1.1.4 客户端浏览器上执行的脚本 JavaScript VBScript applet(需要安装JDK)
1.1.5 ECMAScript核心: JavaScript ActionScript ScriptEase
1.1.6 扩展:node.js 服务端开发(apache+php)手机app: phonegap框架
1.1.7 课程 内容:
JS 基本语法
JS 函数/数组/对象
JS 内置对象
JS 事件
BOM
DOM
AJAX
JQuery 类库

-----------------------------------------------------------------

1.1.8 浏览器
IE IE6 7 8 / IE9+
非IE Chrome firefox opera Safari ...

---------------------------------------------------

1.2 javascript的特点
①.javascript是一种脚本编程语言,也是一种解释性语言
②.javascript的语法结构与C++、java十分类似
③.javascript是一种基于对象的语言
④.javascript具有跨平台性。
⑤.安全性与简单性
⑥ 基于对象(真正的对象 封装 继承 多态)
1.3 javascript 和 java的区别
雷锋和雷峰塔

1.4 javascript 程序运行开发环境
1.NetScape.3.0 以上版本和IE3.0 以上版本
2.用于编辑HTML的字符编辑器

1.5 javascript 优点与局限
1.5.1 优点
①使用javascript在客户端进行验证,节省服务器资源
②方便的操控页面中的各个对象,使网页更加友好
③使多种任务仅在客户端就可以完成而不需要网络和服务器的参与,从而支持分布式的运算和处理
1.5.2 局限
①兼容性
②javascript不能打开,读写和保存计算机上的文件

2. javascript基本语法
2.1 在HTML中使用javascript

①JS应该写在HTML中那个位置??
② 写在header 中的 script标签内
③ 外部文件导入 script标签导入 <script src="script.js"></script> 标签内不能写代码
④ 通过事件 写在标签内 <tag onclick="code...."></tag>

2.2 基本语法
2.2.1 区分大小写
一切都区分大小写
2.2.2 标示符
不能一数字开头,可以由 数字/字母/下划线/$ 组成

2.3 注释
单行注释: //
多行注释: /* */

2.4 语句(指令结束符)
; 或 换行

2.5 关键字和保留字
break else new var
case finally return void
catch for switch while
abstract enum int short

······

-----------------------------------------
2.4 变量
var 变量 = '值';
var 变量 = '值',变量 = '值',变量 = '值';
var 变量1 = 变量2 = '值';

---------------------------------------------------

2.5 数据类型 typeof() 返回一个值或变量 的数据类型
2.5.0 分类
基本类型
String(字串) Boolean(布尔) Number(数值)
复合类型
Object(对象) Array(数组)
特殊类型
Null(空) undefined(未定义) function(函数)

2.5.2字符串类型

字符串连接符 +

定义字符串  " "        ' '

不论是单引号还是双引号  都可以解析  转义字符,  都不能解析变量

2.5.2 数值类型
① 整数类型 十进制 十六进制 八进制
② 浮点型 科学计数法 浮点数的精度问题
③ 数值范围 5e324 ~ 1.7976931348623157e+308 超过范围回自动转换成 infinity(正无穷) -infinity(负无穷)

----------------------------------------------

js02

 

学JS从特效入手>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

1. 获取页面中的一个元素
document.getElementById('id');

将获取到的元素写入值在HTML里
一定要在html元素之后获取,或写在函数之内.

2. 获取或设置 元素的css属性
element.style.color = ''
element.style.backgroundColor = ''

3. 元素的属性(所有的元素都具有的属性)
style
innerHTML (双标签)
HTML元素具有什么属性,当它被获取为对象后,该属性会自动变为该对象的属性
(如 img: src width height alt title)

4. 定时函数
4.1 单次定时
// 参1 字串,JS代码, 参2 时间(毫秒)
setTimeout('', time);
clearTimeout();
4.2 多次定时
setInterval();
clearInterval();

多次定时实验:

单次定时实验:

JS 函数
=============================================================
1. 函数的声明
1). function关键字
function 函数名([形参]){ JS code ... }


2). 表达式方式
var 函数名 = function([形参]){ JS code ... }


3). Function构造函数方式  理解为类和构造方法的结合体 
var 函数名 = new Function('参数1',"func...");

 

2. 调用函数
加括号才算真真的调用
不加括号是 函数引用

3. JS函数特点
可以重复定义

4. JS中的参数
1). 形参与实参
实参个数 > 形参 不受影响
实参个数 < 形参 undefined
2). 参数的默认值
在函数内部 判断 是否是 undefined,如果是则赋值

3). 可变参数个数的函数
arguments 获取到一个数组,内含所有传递的参数

5. JS中的变量作用域 全局和局部变量
    在函数内 使用var 定义的是 局部变量
    在函数外 使用var 定义的是 全局变量
    在函数内 不使用var 定义的是 全局变量

6. JS的作用域链
函数的执行 依赖于变量的作用域, 这个作用域是在 函数定义声明时决定的,而不是 函数调用时决定的!
如果当前作用域里 没有声明变量,则向上一层作用域里面找.
如果直到找到全局里 还都未找到 则在执行函数时 会报错.

 小案例如下:

7. 自执行函数 与 闭包
自执行
( function(){console.log(1)} )()
( function(){console.log(2)} () )
这种写法的含义是 将函数声明 转换成 函数表达式,消除了JS引擎识别函数表达式 和 函数声明的歧义.
告诉JS引擎 这是一个函数表达式,不是函数声明,并且可以在后面 加括号,立即执行 函数的内的代码.

闭包
简单说,闭包就是 能够读取 其他函数内部变量的 函数。
由于在JS中,只有函数内部的 子函数 才能读取 局部变量,
因此可以把闭包 简单理解成 "定义在一个 函数内部的 函数"。
所以,在本质上,闭包就是将 函数内部 和 函数外部 连接起来的一座桥梁。

闭包的最大用处有两个,一个是可以读取 函数内部的变量,另一个就是 让这些变量的值 始终保持在内存中。

三中案例

案例一:

案例二:

方案三:

js对象>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

 

posted @ 2018-08-10 12:01  南城荒凉丶北城伤  阅读(223)  评论(0编辑  收藏  举报