初始javascript
形成原因:
Javascript 诞生于1995 出现的原因是处理服务器验证操作提交服务器时间长 体验效果差
它是页面交互的语言 在浏览器中有顺序从上到下执行 边解释 变执行 是弱类型语言
Netspace netscript 更名为javascript 因为java比较火所以更名为javascript
了解javascript组成部分
a) ECMAScript提供核心语言 所有浏览器都支持
b) DOM文档对象模型 提供操作网页内容的方法接口
c) BOM 提供浏览器的操作方法和接口 window
JavaScript特点
松散型
对象属性
继承性
认识javascript解析机制
Javascript 是一种与HTML标记语言混合使用的脚本语言,直接解析
Javascript的国际标准是ECMAScript 规定语法 类型 语句 关键字 保留字 操作符 对象
如何使用javascript
书写<script type=”text/javascript” charset=”utf-8”></script>可以写在任意位置
推荐写在 <head></head>中 type=”text/javascript”引号可加可不加 推荐加上
defer延迟加载js文件代码
Javascript 调试方法
火狐的firebug 加断点调试
浏览器对象window下的方法
window.alert(); //window可省略
文档对象的调试方法
document.write();
控制台调试方法
console.info(‘输出到控制台’);
注释写法
<!-- 此段脚本代码已经被注释-->
// 单行代码注释
/*
多行代码注释
*/
引用javascript 文件
<script type=”text/javascript” charset=”utf-8” src=”js文件路径地址”>
这里不能再写js代码
</script>
Javascript变量
变量的声明
1、var 变量名必须是字母 下划线 美元符
2、长度不能超过255个字符
3、变量名不允许使用空格
4、不能使用脚本语言定义的关键字作为变量名
5、变量名区分大小写
全局变量
在方法外声明的变量
方法内部,没有加var关键字声明的变量
一旦定义在任何地方都可调用
局部变量
使用var声明的变量 在方法内部起作用
方法
使用function关键定义的函数代码块
function demo(){
//我是方法体
}
数据类型
基本类型
number
a)整数和小数 高精度17位小数
b)NaN 判断是否是数 不是一个数 返回true
c)正负无穷
d)浮点数不要进行加减判断
undefind类型
表示变量声明了没有被赋值 返回值是undefined
NULL类型
返回值是空值
Boolean类型
返回 true false
String类型
var str = “我是字符串类型”;
引用数据类型
Object类型
var arr = [1,2,3]; //数组
var dates = new Date(); //日期
var obj = {}; //空对象
根据变量值决定返回值类型
类型判断语法 typeof()
变量的自动转换和语句
== 可以自动转换 比较的是数值
=== 可以经过自动转换先比较值,在比较数值类型
引用类型数组
数组
ECMAScript中数组是常常用的引用类型。 数组也是一种对象
var arr = new Array();
Var arr = [1,2,3,true,’abc’,new Date()];
js中数组类似于java中map容器长度类型随意元素类型随意
arr.toString(); //把对象转换为字符串
常用方法
push
push(1,2,true); //从数组的尾部添加元素 具有返回值 返回数组的元素个数
pop
pop(); //从数组的尾部移除元素 返回值 是移除内容
shift
shift(); //删除数组第一个元素 不需要参数
unshift
unshift(); //从头部插入元素
splice
splice(1,2,3,4,5);
// 第一个参数:起始位置
// 第二个参数:表示截取的个数
// 第三个参数:追加的新元素个数 从截取的位置追加
slice
slice(2,4); // 第二个参数开始第四个结束 左闭右开 不操作数组本身
contact
contact //不操作数组本身 将数组合并
join
join //在每个元素之间加入内容 不操作本身
sort //正序排序
reverse //倒序排序 按照元素字符串个数来比较
Object类型
了解其他引用类型
单体类型 data、 math
ECMAScript
位置方法
Arr.isArray(element);
这是Array对象的一个静态函数,用来判断对象是不是数组
var a = new Array(123);
var b = new Date();
console.log(Array.isArray(a)); //true
console.log(Array.isArray(b)); //false
Arr.indexof(ele);
var a = new Array(1,2,3,4,5,6,7,8,4);
A.indexof(2); //查找元素为2的下角标元素
B.lastindexof(4); //查找最后一个元素为4的下角标元素
迭代方法
Arr.foreach(ele,index,array);
//当前元素,元素索引,整个数组 遍历函数 会遍历数组中每一个元素
Arr.some(function(element,index,array){})
//数组项有一个返回true则返回true 否则返回false
Arr.every(function(element,index,array){})
//返回真假值 每个函数都返回true的时候才返回true遇到false时候 返回false
//返回真假值 有一项返回true 都返回true 都返回false 返回false
//空数组上返回true some返回false 对数组每一项进行遍历进行判断
Arr.reduce(function(prev,cur,index,array){});
//前面元素 后面元素 索引值 数组
Arr.map(function(ele){})
//回掉函数组成的新的函数 进行运算并取回结果
Arr.filter(function(element){})
//返回数组的一个子集,回调函数用于逻辑判断是否返回,返回true则把当前元素加入到返回数组中, //false则不加,新数组只包含返回true的值,索引缺失的不包括,原数组保持不变
掌握Object
Object 是所有类的基础类
var object = new Object();
var object = {}; //直接量形式
delete 操作符 删除对象方法
遍历对象 数组 for in
for(var attribute in arr){
attribute //数组的属性 数组的键
obj[attrubute] //数组的值
}
Constructor //保存创建函数
Hasownproperty(propertyNames); //用于检测给定属性对象中是否存在
Map
var maparr = new Map();
删除数组中重复元素
单体概念
不需要实例化就可以使用
Global 对象
encodeURL //(url://)不会解码
encodeURLComponent // 常用的方法
encodeURL //解码1
encodeURLComponent // 解码2
eval(string) 方法 无形的javascript解析器
escape //转码
unescape //解码
isNaN //不是number类型 返回trun 否则返回 false
Math 对象
Date对象
函数
function demo(a,b){}
//demo为函数名 没有返回值类型 a,b参数没有类型 demo(a,b); 即为调用
//function 相当于函数入口return 相当于函数的出口 函数也是一种类型
函数的三中的定义方式
1、function语句是
function(){} 只解析一次 效率高 占内存 会优先解释
2、函数的直接量形式
var test2 = function(){}
3、构造函数式
var test3 = new Function(“变量1”,”变量2”,”函数体;”);
调用完直接销毁 不占内存 效率低 变量声明没有赋值
解析顺序
变量的作用域
函数参数
形参和实参可以不一样 未定义实参 形参进行运算 依据返回值类型判断返回值类型
arguments 获取参数在函数内部使用 arguments.length获取实参个数 为数组类型
用最多的 做递归操作 arguments.callee 指向当前函数
this对象的使用
运行时期基于运行环境所绑定的
call、apply
绑定函数用于传递参数 扩大作用域 无需解耦合对象和方法没有耦合关系
function sum(a,b){
return a+b;
}
function demo(num1,num2){
return sum.call(this,num1,num2);
}
function demo1(num1,num2){
return sum.apply(this,[num1,num2]);
}
执行环境作用域链
定义了变量或函数有权访问的其他数据决定了各自的行为
每一个函数都有自己的执行环境
作用域链的作用是保证对执行环境有权访问的所有变量和函数的有序访问
var demo = function(){//do something;}
this对象执行的宿主环境 内部函数可以访问外部定义的变量 可以向上找变量 定义全局变量效率低
垃圾收集、块级作用域
内部定义回收器隔一段时间清理内存 标记法 引用法
Js中没有会计作用域的概念
闭包
扩大函数作用域数值 必须了解作用域链 具有封闭性保存数据安全
类的创建实例对象
面向对象
趋近于对象的语言 js没有类的概念用代码模拟
特点:
工厂模式 java封装
构造函数形式 实例化对象
类的模板要大写 普通方法调用直接定义在window上
模拟类的方式写代码
1、工厂模型 定义好的模板 直接调用 推荐使用函数构造模式
2、构造函数模式 new 一个实例化 调用 封装好的模板
3、constructor p1.constructor == Person instanceof判断是不是 该对象的实例
4、在另一个对象的作用于中调用
理解原型:propertype
创建每一个函数都有prototype属性,这个属性其实是一个指针,而这个指针总是指向一
个对象 这个对象的用途就是将特定的属性方法包含在内,起到一个所有实例所共享的作用
根据实例对象获得原型对象
getPrototypeOf();
操作符 in
可以判断对象是否具有某种属性 不区分原型和实例化对象
Object.keys();
可以找到对象中的所有属性
each方法的实现
forEach方法循环遍历数组的每一项
理解继承
Js事件
attachEvent();//添加元素绑定事件 只兼容IE
attachEvent(“onclick”,function(){});
addEventListener(“click”,function(){},false); //非IE
setCapture();捕获鼠标单击事件