JavaScript学习笔记

初始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();捕获鼠标单击事件

原文地址:https://www.cnblogs.com/qiaorenjie/p/4854324.html