javascript-知识点集合

第三课、JavaScript的语法与关键字
1、JavaScript的语法
字符串、数字、布尔、数组、对象、Null、Undefined
1、js的变量区分大小写
username userName  这是两个不同的变量
2、每行结尾的分号可有可无,如果语句的结束处没有分号,那么js会自动将这行代码的结尾作为语句的结尾。
alert("Hello World");
alert("Hello World")
3、变量是弱类型
定义变量时至使用var运算符。
比如:var username="tom";正确
     var age=30;正确
     int age=30;错误
4、使用大括号标签代码块
{  //代码} 被封装在大括号内的语句按照顺序执行。

5、注释
1、单行注释 //
   单行注释使用双斜线"//" 开头,在"//"后面的文字即为注释内容,
   注释的内容在代码执行过程中不起作用。
   var now=new Date();//获取日期对象
2、多行注释
多行注释以"/*"开头,以"*/"结尾,在两者之间的内容为注释内容,
在代码执行过程中不起任何作用。
/*
*功能:获取当前日期
*作者:tom
*/
function getClock(){
//内容
}
2、JavaScript中的关键字
var username="tom";
关键字不能用作变量名,函数名以及循环标签。
abstract  continue  finally    instanceof  private  this
boolean   default   float      int         public   throw
break     do        for        interface   return   typeof
byte      double    function   long        short    true
case      else      goto       native      static   var
catch     extends   implements new         super    void
char      false     import     null        switch   while
class     final     in         package     with     synchronized

第四课、JavaScript的数据类型

var flag=true;

1、数值型
整型:123   //十进制
     0123  //八进制,以0开头
     0x123 //十六进制,以0x开头

浮点型:整数部分加小数部分组成,只能用十进制来表示,不过可以使用科学记数法
3.1415926  //标准形式的浮点数
3.14E9     //采用科学记数法来表示,代表的是3.14乘以10的9次方

2、字符型

字符型数据是使用单引号或者双引号括起来的一个或者多个字符。
'a' 'Hello World'
"a" "Hello World"
 
JavaScript与Java不一样,js没有char数据类型,如果要表示单个字符,必须
使用长度为1的字符串。

单引号包含双引号:'大家好,我叫"tom"'
双引号包含单引号:"大家好,我叫'tom'"
3、布尔型

布尔型数据只有true或者false。在js中也可以使用整数0代表false,使用非0的
整数来代表true。
4、转义字符

以反斜杠开头的不可显示的特殊字符通常称为控制字符,也被称为转义字符。
\b 退格
\n 换行
\f 换页
\t Tab符
\r 回车符
\' 单引号
\" 双引号
\\ 反斜杠

5、空值

null ,用于定义空的或者不存在的引用。

var a=null;

6、未定义值

已经声明但是没有赋值的变量。

var a;
alert(a);
undefined 是关键字,用来代表未定义值。

第五课、变量的定义与使用

1、变量的命名规则

变量名由字母、数字、下划线组成,但是不能以数字开头。
不能使用JavaScript中的关键字。
严格区分大小写。
username  userName

2、变量的声明

var variable;

可以使用一个var 声明多个变量,比如
var now,year,month,date;

可以在声明变量的同时对它进行赋值,也就是初始化。
var now="2015-10-10",year="2015",month="10",date="10";

如果只是声明了变量,没有赋值,那么该变量的默认值是undefined

JavaScript是弱类型,声明的时候不需要指定变量的类型,变量的类型将根据
变量的值来确定。

全局变量的声明:1、在函数体外声明的都是全局变量。无论是否有var 声明。
2、在函数体内部使用var声明的变量是局部变量,不使用var
声明直接赋值的变量是全局变量。

var quanju=123;//这是全局变量
//如果给一个尚未声明的变量赋值时,JavaScript会自动使用该变量创建一个
//全局变量。
 quanju1="abc";//这也是全局变量

 function test(){
var quanju3="aaaaa";//这是局部变量
quanju2="12345";//这也是全局变量
test2();
 }

 function test2(){
alert(quanju2);
 }

3、变量的作用域

变量的作用域是指变量在程序中的有效范围。
全局变量:定义在所有函数之外,作用于整个代码的变量。
局部变量:定义在函数体内,只作用于函数体内的变量。

第六课、运算符的应用

1、赋值运算符
var userName="tom";//简单赋值运算符
复合赋值运算符
a+=b; //相当于a=a+b;
a-=b; //相当于a=a-b;
a*=b; //相当于a=a*b;
a/=b; //相当于a=a/b;
a%=b; //相当于a=a%b;
a&b=b;//相当于a=a&b;
a|=b; //相当于a=a|b;
a^=b; //相当于a=a^b;

2、算术运算符

+  alert(3+5); 
-  *  /  %
++ i=1;j=i++;//j是1,i是2。因为i++是先用后加。
  i=1;j=++i;//j是2,i是2。因为++i是先加后用。
-- 同理。
除法运算时,0不能作为除数,如果0是除数,则返回结果为Infinity。

3、比较运算符

<  小于   alert(1<9);//true
>   大于 alert(1>9);//false
<=
>=
==  等于       只根据表面值进行判断,不涉及数据类型。alert("11"==11);
=== 绝对等于   不仅判断表面值,还要判断数据类型是否一样。
!=  不等于     只根据表面值进行判断,不涉及数据类型。
!== 不绝对等于 不仅判断表面值,还要判断数据类型是否一样。

4、逻辑运算符

!    逻辑非。!真=假,!假=真  !("11"===11) 返回true
&&   逻辑与。只有当两个操作数的值都为true的时候,结果才会true。 
false&&true 返回值是false
true&&false 返回值为false
true&&true  返回值为true
比如: (1<2)&&(2>3) 返回的是false
||   逻辑或。只要两个操作数有一个是true,则结果就是true。
false||true  返回值是true
true||false  返回值是true
false||false 返回值是false
比如: (1<2)||(2>3) 返回的是true
5、条件运算符

条件运算符是JavaScript支持的一种特殊的三元运算符。
语法格式:  操作数?结果1:结果2;
   如果操作数的值为true,则整个表达式的结果为结果1
            如果操作数的值为false,则整个表达式的结果为结果2
   var a=30;
   var b=28;
   var c=a>b?a:b;//30

6、字符串运算符

连接字符串的两种方式
+ 。var a="Hello"+" World";
+=。a+=" Hello EveryOne!";//相当于a=a+"Hello EveryOne!";

第七课、流程控制之if、switch语句

1、if条件判断语句
1、if(expression){
//expression为true的时候执行里面的内容
  }

2、if(expression){
//expression为true的时候执行里面的内容
  }else{
//expression为false的时候执行里面的内容
  }

3、if(expression1){
//expression1为true的时候执行里面的内容
   }else if(expression2){
//expression2为true的时候执行里面的内容
   }else if(expression3){
//expression3为true的时候执行里面的内容
   }else{
//这个else可有可无。如果有的话,则上述条件
//都不满足的时候执行else
   }
2、switch语句

语法格式:
switch(expression){

case judgement1:statement1:break;
case judgement2:statement2:break;

...
default:defaultstatement;
}
示例:
var username="tiger2";
switch(username){
case "jerry":alert("小老鼠");break;
case "tom":alert("猫");break;
case "tiger":alert("老虎");break;
default:alert("没有匹配到任何值");
}

课下作业:把以上示例用if语句来实现。



第八课、流程控制之for、while、do-while语句

1、for循环语句
语法格式:for(①initialize;②test;④increment){
③statement
 }
 ①->②(true)->③->④->②(true)->③->④->......
 ①->②(true)->③->④->②(false) for循环结束
 示例:
var sum=0;
for(var i=1;i<=10;i++){
sum+=i;
}
alert("总和为:"+sum);

2、while循环语句

while循环的循环体可能一次都不执行。

语法格式:while(①expression){
②statement
}
①(true)->②->①(true)->②.....
①(false) 直接终止while循环。
示例:
var sum1=0;
var i=100;
while(i<=1){
sum1+=i;
i++;
}
alert("while总和为:"+sum1);
3、do-while循环语句
do-while循环的循环体能够保证至少执行一次。
语法格式:
do{
①statement
}while(②expression);

示例:
var sum2=0;
var i2=1;
do{
sum2+=i2;
i2++;
}while(i2<=10);
alert("do-while总和为:"+sum2);

while循环是 先判断条件是否成立,然后再根据判断的结果是否执行循环体。也就是
说循环体有可能一次都执行不了。
do-while循环是 先执行一次循环体,然后再判断条件是否成立。所以不管条件
是否成立,至少能够执行一次。


第九课、函数的定义与调用

1、函数的定义

function functionName([parameter1,parameter2,...]){
statments;
[return expression;]
}
function是必须要写的,因为这是定义函数的关键字。
functionName 是函数名,必须要写,而且在同一个页面中,函数名是唯一的。
并且区分大小写。
parameter:可选参数,用于指定参数列表。当使用多个参数时,参数间使用
逗号进行分隔。一个函数最多可以有255个参数。
statements:必选参数,这是函数体,用于实现函数功能的语句。
expression:可选参数,用于返回函数值。expression可以是任意的表达式、变量或常量。
//函数定义
示例:function account(price,number){
var sum=price*number;
return sum;
    }

    var i=account(10,5);//函数调用

2、函数的调用

function checkName(){
var str=form1.userName.value;
if(str==""){
alert("用户名不能为空");
}else{
alert("用户名可以注册");
}
}

<body>
<form name="form1" method="post" action="">
请输入姓名:<input type="text" name="userName" id="userName" size="30"/>
<br/>
<input type="button" value="检测" οnclick="checkName()"/>
</form>
</body>


第十课、事件与事件处理

1、事件
什么是事件?例如在页面载入完毕时,将触发onload(载入)事件;当用户单击按钮时,
将触发按钮的onclick事件等。
常用事件:
onabort: 对象载入被中断时触发
onblur: 元素或窗口本身失去焦点时触发
onchange: 改变<select>元素中的选项或其他表单元素失去焦点,并且在其
获取焦点后内容发生过改变时触发
onerror: 出现错误时触发
onfocus: 任何元素或窗口本身获得焦点时触发
onkeydown: 键盘键(包括Shift、Alt等)被按下时触发
onkeypress: 键盘键被按下,并产生一个字符时触发。也就是说按下Shift或Alt等键
不会触发
onkeyup: 释放键盘上的按键时触发
onload: 页面完全载入后触发
onunload: 页面完全卸载后触发
onclick: 单击鼠标左键时触发。当光标的焦点在按钮上,并按Enter键时也会触发
ondblclick: 双击鼠标左键时触发
onmousedown: 单击任何一个鼠标按键时触发
onmousemove: 鼠标在某个元素上移动时持续触发
onmouseout: 鼠标从指定的元素上移开时触发
onmouseover: 鼠标移到某个元素时触发
onmouseup: 释放任意一个鼠标按键时触发
onreset: 单击重置按钮时,在<form>上触发
onresize: 窗口或框架的大小发生改变时触发
onscroll: 在任何带滚动条的元素或窗口上滚动时触发
onselect: 选中文本时触发
onsubmit: 单击提交按钮时,在<form>上触发

2、事件处理

事件处理程序是用于响应某个事件而执行的处理程序。事件处理程序可以是任意的
JavaScript语句,通常使用函数来对事件进行处理。

第一种方式,在HTML中绑定:
<script language="javascript">
function save(){
alert("保存按钮被点击");
}
 
</script>

<input type="button" name="save" value="保存" οnclick="save()"/>

第二种方式,在JavaScript中绑定:
①<input type="button" name="save" id="save" value="保存"/>

<script language="javascript">
 
②var bt_save=document.getElementById("save");
bt_save.οnclick=function(){
alert("保存按钮被单击");
};
 
</script>

第二种方法要注意先执行①,才能执行②。  这样的话,需要把js放在html的后面,那么就要放在</body>的上面就可以了



第十一课、String对象介绍

1、属性

在JavaScript中可以用单引号或者双引号括起来的一个字符串当作一个字符串对象
的实例,所以可以在某个字符串后面加上.去调用String对象的属性和方法。

length:返回String对象的长度。代表的是字符串当中字符的个数。
      每个汉字按一个字符计算
"大家好".length;//值为3.
"Hello World".length;//值为11

2、常用方法
indexOf(subsString[,startIndex])
用于返回第一次出现子字符串的字符位置。如果没有找到指定的子字符串,
则返回-1。
subString:必选参数。要在String对象中查找的子字符串
startIndex:可选参数。
示例:
 var str="admin@java1995.com";
 var index=str.indexOf("@",6);
 alert(index);

substr(start[,length])
用于返回指定字符串的一个子串。
start:必选参数,用于指定获取子字符串的起始下标。如果是一个负数,
     那么表示从字符串的尾部开始算起始位置。-1代表最后一个字符,
     -2代表倒数第二个字符,以此类推。
length:可选参数,用于指定字符串中字符的个数。如果省略,则返回从
start开始位置到字符串结尾的子串。
 
示例:
 var word="One World One Dream!";
 var subs=word.substr(4,5);// World

 var word="One World One Dream!";
 var subs=word.substr(4);// World One Dream!

substring(from[,to])
from:用于指定要获取子字符串的第一个字符在string中的位置
to:可选参数,指定最后的位置。
[from,to)  包含from,不包含to.所以如果要获取to的字符,需要to+1
示例: 
 var word="One World One Dream!";
 var subs=word.substring(4,8+1);// World

split(delimiter[,limit])
用于将字符串分割为字符串数组。
delimiter:指定的分隔符
limit:可选参数,用于指定返回数组的最大长度。
返回值:一个字符串数组

示例:
var str="www.java1995.com";
 var arr=str.split(".");
 for(var i=0;i<arr.length;i++){
alert(arr[i]);
 }
 //以上代码弹出的值依次为:www java1995 com

var str="www.java1995.com";
 var arr=str.split(".",2);
 for(var i=0;i<arr.length;i++){
alert(arr[i]);
 }
 //以上代码弹出的值依次为:www java1995



第十二课、Math与Date对象介绍

1、Math对象

在使用Math对象时不能使用new关键字创建实例,而是直接使用对象名.成员 这种格式
 alert(Math.PI);
 alert(Math.random());
 alert(Math.max(3,76,21,90,5,6,-5,-903));
 alert(Math.min(3,76,21,90,5,6,-5,-903));

2、Date对象
var now=new Date();//创建Date对象
var year=now.getFullYear();//获取年份
var month=now.getMonth()+1;//获得月份
var date=now.getDate();//获取日期
var day=now.getDay();//获取星期
var hour=now.getHours();//获取小时
var minutes=now.getMinutes();//获取分钟
var sec=now.getSeconds();//获取秒


第十三课、Window对象介绍

    window对象即为浏览器窗口对象,是所有对象的顶级对象。window对象提供了许多
属性和方法,这些属性和方法被用来操作浏览器页面的内容。

    window对象和Math对象一样,也不需要使用new关键字创建对象实例,而是直接使用
对象名.成员 的格式来访问其属性或方法。

1、window对象的常用属性

document 对窗口或框架中含有文档的document对象的只读引用
defaultStatus 一个可读写的字符,用于指定状态栏中的默认消息
frames 表示当前窗口中所有的frame对象的集合
location 用于代表窗口或框架的location对象。如果将一个URL赋给该属性,、
那么浏览器将加载并显示该URL指定的文档。
length 窗口或框架包含的框架个数
history 对窗口或框架的history对象的只读引用
name 用于存放窗口的名字
status 一个可读写的字符,用于指定状态栏中的当前信息
top 表示最顶层的浏览器窗口
parent 表示包含当前窗口的父窗口
opener 表示打开当前窗口的父窗口
closed 一个只读的布尔值,表示当前窗口是否关闭。
self 表示当前窗口
screen 对窗口或框架的screen对象的只读引用,提供屏幕尺寸、颜色深度
等信息。
navigator 对窗口或框架的navigator对象的只读引用,通过navigator对象
可以获得与浏览器相关的信息
2、window对象的常用方法

由于window对象使用十分频繁,而且又是其他对象的父对象,所以在使用window对象
的属性和方法时,JavaScript允许省略window对象的名称。

alert() 弹出一个警告对话框
confirm() 显示一个确认对话框,单击确认按钮时返回true,
否则返回false
prompt() 弹出一个提示对话框,并要求输入一个简单的
字符串
blur() 把键盘的焦点从顶层浏览器窗口中移走
close() 关闭窗口
focus() 把键盘的焦点赋予给顶层的浏览器窗口
open() 打开一个新窗口
scrollTo(x,y) 把窗口滚动到(x,y)坐标指定的位置
scrollBy(offsetx,offsety) 按照指定的位移量滚动窗口
setTimeout(timer) 在经过指定的时间后执行代码
clearTimeout() 取消对指定代码的延迟执行
moveTo(x,y) 将窗口移动到一个绝对位置
moveBy(offsetx,offsety) 将窗口移动到指定的位移量处
resizeTo(x,y) 设置窗口的大小
print() 相当于浏览器工具栏的打印按钮
setInterval() 周期执行指定的代码
clearInterval() 取消周期性的执行代码

第十四课、DOM技术概述 
 1、DOM概述 DOM是一种与浏览器、平台及语言无关的接口,能够以编程方式访问和操作文档。
 1、DOM是Document Object Model(文档对象模型)的简称。 
 2、提供了访问、操作该模型的API。
 2、DOM的分层结构 在DOM中,文档的层次结构被表示为树形结构。树是倒立的,树根在上,枝叶 在下面,树的节点表示文档中的内容。 在树形结构中, 直接位于一个节点之下的节点被称为该节点的子节点; 直接位于一个节点之上的节点被称为该节点的父节点; 具有相同父节点的节点是兄弟节点; 一个节点的下一个层次的节点集合是该节点的后代; 一个节点的父节点,祖先节点以及其他所有位于他之上的节点都是该节点的祖先;



第十五课、DOM遍历文档

1、遍历文档
在DOM中,HTML文档各个节点被视为各种类型的Node对象,并且将HTML文档表示为
Node对象的树。

   Node对象的属性

属性 类型 描述
parentNode Node 节点的父节点,没有父节点是为null
childNodes NodeList 节点的所有子节点的NodeList
firstChild Node 节点的第一个子节点,没有则为null
lastChild Node 节点的最后一个子节点,没有则为null
nodeName String 节点名
nodeValue String 节点值
previousSibling Node 上一个兄弟节点
nextSibling Node 下一个兄弟节点
nodeType short 表示节点类型的常量
Element <a > <img >
Text  文本


第十六课、DOM操作文档

Node对象的常用方法

方法 描述
insertBefore(newChild,refChild) 在现有节点refChild之前插入节点
newChild
replaceChild(newChild,oldChild) 将子节点清单中的子节点oldChild
换成newChild,并返回oldChild节点
removeChild(oldChild) 将子节点清单中的子节点oldChild
删除,并返回oldChild节点

appendChild(newChild) 将节点newChild添加到该节点的子节点
清单末尾。如果newChild已经在树中,
则先将其删除

hasChildNodes() 返回一个布尔值,表示节点是否有子节点

cloneNode(deep) 返回这个节点的拷贝(包括属性)。如果
deep为true则拷贝所有包含的节点,否则
只拷贝这个节点。

课下作业:新增一个功能,能够删除指定的行数。删除之前要进行判断输入的内容
是否合法。


第十七课、正则表达式(1)

一个正则表达式是由普通字符(如a~z)以及特殊字符(称为元字符)组成的模式字符串。
该模式字符串描述在查找文字主体时待匹配的一个或多个字符串。正则表达式作为一
个模板,将某个字符模式与所搜索的字符串进行匹配。

1、字符类

 代码   说明       示例
[...] 匹配方括号中字符序列的任意一个 /[012]/可以与0A1B2C中的字符0或1或2匹配
字符。其中可以使用连字符"-"匹配 /[0-5]/可以与a3g02gsf91dfs4中的0到5
指定范围内的任意字符。 之间的任意数字字符匹配

[^...] 匹配方括号中字符序列未包含的任意 /[^012]/可以与0A1B2C中的除0、1、2
字符。其中可以使用连字符"-"匹配不 之外的任意字符匹配,在这里匹配A或B或C
在指定范围内的任意字符。 /[^a-z]/可以与a3g02gsf91dfs4不在小写
字母a-z之间的任意字符匹配。

. 匹配除了换行和回车之外的任意字符, 无
相当于[^\r\n]

\d 匹配任意一个数字字符,相当于[0-9] /\d\d/可以匹配wy32k中的32

\D 匹配任意非数字字符,相当于[^0-9] /\D/可以匹配wy3k中的w或y或k

\s 匹配任意空白字符,如空格、制表符、 /\s\d\d/可以匹配my age is 20.中的 20
换行符等,相当于[\t\n\x0B\f\r] 注意2前面的空格。

\S 匹配任意非空白符,相当于[^\t\n\x0B\f\r] /\S/可以匹配A B中的A或B

\w 匹配任何英文字母、数字字符以及下划线, /\w/可以匹配shdf82w09_+&^中的字母、
相当于[a-zA-Z0-9_] 数字、下划线

2、量词

代码 说明 示例
? 匹配前一项0次或1次 /JS?/可以匹配JScript中的JS或者JavaScript中
的J

+ 匹配前一项1次或多次, /JS+/可以匹配JS,也可以匹配JSSSS或者JSSSSSS,
但至少出现1次 也就是说可以匹配J后面出现一个或多个S。

* 匹配前一项0次或者多次, /bo*/可以匹配b、bo、boo、boooo之类的字符串
也就是任意次

{n} 匹配前一项恰好n次,其中n为 /o{2}/可以匹配book中的两个o,也可以匹配booook
非负整数 中任意两个连续的o

{n,} 匹配前一项至少n次 /o{2,}/不匹配home中的o,因为至少要匹配两个o。
所以可以匹配good或者gooooood中的所有o

{n,m} 匹配前一项至少n次,但不能 /o{2,5}/可以匹配book中的两个o,也可以匹配
超过m次,其中n、m是非负整 boooook中的5个连续的o
数,并且n<=m

在使用{n,m}时,数字与逗号之间不能有空格符

3、指定匹配位置

代码 说明 示例
^ 匹配字符串的行开头。 /^g/匹配good中的g,但不匹配bag中的g
^必须出现在指定字符
串的最前面才起作用。

$ 匹配字符串的行结尾。 /g$/匹配bag中的g,但不匹配good中的g
$必须出现在指定字符
串的最后面才起作用。

\b 匹配单词的边界 /e\b/匹配"I love seek"中love的e,不匹配seek中的e

\B 匹配单词的非边界 /e\B/匹配"I love seek"中seek的e,不匹配love中的e

4、使用选择匹配符
    正则表达式的选择匹配符只有一个"|",使用"|"可以匹配指定的多个选项中的任意一项。
例如/World|Dream/可以匹配"One World One Dream"中的World或者Dream

5、分组
    分组就是使用小括号将多个单独的字符或字符类组合成子表达式,以便可以像处理一个
独立的单元那样,用"|"、"*"、"+"或者"?"等来处理他们。比如/J(ava)?Script/可以匹配
JavaScript,也可以匹配JScript  

更多资料请加入Java资源库官方群:253190527

Java资源库原创教程《JavaScript脚本语言轻松入门》
讲师:李伟

第十八课、正则表达式(2)

1、通过RegExp类的构造方法创建
\d{3}
语法格式:new RegExp(pattern[,flags])
pattern:必选参数,用于指定需要进行匹配的模式字符串。
flags:可选参数,用于指定正则表达式的标志信息。
g:全局标志。如果设置了该标志,对于某个文本执行搜索或者替换时,将对
 文本中的所有匹配部分起作用,否则仅搜索或替换第一次匹配的内容。
i:忽略大小写标志。
m:多行标志。如果不设置这个标志,那么^只能匹配字符串的开头,$只能
 匹配字符串的结尾;如果设置了这个标志,那么^可以匹配多行字符串的
 每一行的开头,$可以匹配多行字符串的每一行的结尾。

var objExp=new RegExp("\\d",g);

2、通过正则表达式字面量创建RegExp对象

正则表达式字面量由两条斜线//中间加入模式匹配字符串组成。如果还要指定标志
信息,则在最后的斜线/后面加上标志信息,比如g或者i.
var objExp=/\d/g;

3、使用test()方法进行模式匹配
test()方法用于对一个指定的字符串执行模式匹配,如果搜索到匹配的字符,
返回true,否则返回false
var objExp=/\d/g;
objExp.test("abc");
4、使用exec()方法进行模式匹配

exec()方法返回值不是true或者false,而是当没有搜索到匹配的字符时,返回null,
否则返回一个数组,这个数组的第一个元素包含与正则表达式相匹配的字符串,其他
元素包含的是匹配的各个分组(用括号括起来的子表达式)

语法格式:
regExp.exec(str)


JS小技巧

1. innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用innerHTM


这种var x = new string ;如何声明?

注意在函数内要使用var才能声明局部变量






学到这儿了



分号是用来分隔可执行JavaScript语句。 
由于函数声明不是一个可执行语句,所以不以分号结束。

var x = function (a, b) {return a * b};
var z = x(4, 3);

以上函数实际上是一个 匿名函数 (函数没有名称)。

函数存储在变量中,不需要函数名称,通常通过变量名来调用


在 JavaScript 中,很多时候,你需要避免使用 new 关键字。



匿名自我调用的函数 (没有函数名)


(function () {
    var x = "Hello!!";      // 我将调用自己
})();


JavaScript 函数可作为表达式使用:
JavaScript 函数作为一个值使用:

arguments.length 属性返回函数调用过程接收到的参数个数:  
function myFunction(a, b) {
    return arguments.length;
}


toString() 方法将函数作为一个字符串返回:
function myFunction(a, b) {
    return a * b;
}
var txt = myFunction.toString();


函数定义作为对象的属性,称之为对象方法。
函数如果用于创建新的对象,称之为对象的构造函数。


function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}

// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;                             // 返回 "John"


 
   
  1. function myFunction(a, b) {
  2. return a * b;
  3. }
  4. var b = myFunction();
  5. var a =myFunction.call(b, 10, 2);
  6. document.writeln(a);

所有函数都能访问全局变量。  

实际上,在 JavaScript 中,所有函数都能访问它们上一层的作用域。

JavaScript 支持嵌套函数。嵌套函数可以访问上一层的函数变量。


仔细研究一下JS中()()这样的写法的问题,可能涉及到闭包的问题

JS中的~符号,可以把函数转换为表达式

闭包:就是拿到本该拿不到的类中的变量


 
   
  1. var counter = 2;
  2. function add() {
  3. var counter;
  4. return function () {return counter += 1;}
  5. };
  6. add()
  7. add()
  8. add()
  9. alert(add()());
js也是变量就近原则,所以输出总是1

另一个就是变量声明、函数前置,这个对理解作用域很重要

关于闭包和this的一个很好的程序
 
   
  1. m = 100;
  2. var obj = {
  3. m: 1,
  4. test:function(){
  5. alert(this.m);
  6. return function(){
  7. alert(this.m);
  8. }
  9. }
  10. }
  11. var s = obj.test();
  12. s();

简要说明this的能力要强于prototype的作用
 
   
  1. function test(){
  2. this.a = 1;
  3. }
  4. test.prototype.a = 100;
  5. var p = new test;
  6. alert(p.a);
输出结果是1

按引用传递的时候,会改变引用外面的值
 
   
  1. var obj ={
  2. name:"jingya"
  3. }
  4. function test(oo){
  5. oo.age = 25;
  6. console.log('inner',oo);
  7. }
  8. test(obj)
  9. console.log('out',obj)
在使用getElementById调整CSS属性的时候,要把""加上
 
  
  1. function bb(){
  2. document.getElementById("p_test").style.color = "red" ;
  3. document.getElementById("p_test").style.textAlign = "center" ;
  4. }
可以使用this来简化代码
 
   
  1. function changetext(id)
  2. {
  3. id.innerHTML="Ooops!";
  4. }
  5. </script>
  6. </head>
  7. <body>
  8. <h1 onclick="changetext(this)">Click on this text!</h1>

冒泡是内部事件先触发


通过DOM函数修改HTML代码
 
   
  1. var para = document.createElement("h1")
  2. var node = document.createTextNode("this is new word")
  3. para.appendChild(node)
  4. var a = document.getElementById("div1")
  5. a.appendChild(para)

惰性载入函数
函数颗粒化
级联函数

进制转换
 
   
  1. var myNumber=128;
  2. myNumber.toString(16); // returns 80
  3. myNumber.toString(8); // returns 200
  4. myNumber.toString(2); // returns 10000000

无穷大(Infinity)

NaN - 非数字值,如果是,返回true

var x = 1000 / "Apple";
isNaN(x); // returns true
var y = 100 / "1000";
isNaN(y); // returns false

JavaScript 字符串

 
   
  1. var answer="It's alright";
  2. var answer="He is called 'Johnny'";
  3. var answer='He is called "Johnny"';
字符串使用strong>split()函数转为数组:
 
   
  1. txt="a,b,c,d,e" // String
  2. txt.split(","); // Split on commas
  3. txt.split(" "); // Split on spaces
  4. txt.split("|"); // Split on pipe

javascript参数的作用域
在函数的函数里,才能访问上一层的函数,单独的一个function函数无法去上一层访问windows内的函数
 
   
  1. var my = 10;
  2. function changetext()
  3. {
  4. var ms = 10;
  5. function s(){
  6. alert(ms);
  7. }
  8. s();
  9. }
RegExp
正则表达式描述了字符串的模式对象

i - 修饰符是用来执行不区分大小写的匹配。

g - 修饰符是用于执行全文的搜索(而不是在找到第一个就停止查找,而是找到所有的匹配)。

 test()方法搜索字符串指定的值,根据结果并返回真或假。

exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。


 
    
  1. var str="Visit W3CSchool";
  2. var patt1=/w3cschool/i;
  3. Visit W3CSchool
 
     
  1. var str="Is this all there is?";
  2. var patt1=/is/g;
  3. Is this all there is?
 
      
  1. var str="Is this all there is?";
  2. var patt1=/is/gi;
  3. Is this all there is?
 
       
  1. var patt1=new RegExp("e");
  2. document.write(patt1.test("The best things in life are free"));
  3. true
 
        
  1. var patt1=new RegExp("e");
  2. document.write(patt1.exec("The best things in life are free"));
  3. e

setInterval() 方法

setInterval() 间隔指定的毫秒数不停地执行指定的代码

 
         
  1. setInterval(function(){alert("Hello")},3000);

如何停止执行?

clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。

 
   
  1. myVar=setInterval("javascript function",milliseconds);

setTimeout() 方法

 
    
  1. setTimeout(function(){alert("Hello")},3000);

如何停止执行?

clearTimeout() 方法用于停止执行setTimeout()方法的函数代码。

 
     
  1. myVar=setTimeout("javascript function",milliseconds);

链式操作
在html中的onload没有注册函数,要不然jquery中的ready函数没法使用








转载于:https://www.cnblogs.com/weloveshare/p/5325869.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值