js 自学，云知梦知识 点理论

一、第1章（1--4）

何为js特效

1、定义事件（触发时机+行为）

2、触发事件（行为发生）

3、事件发生是具有重复性

 

js是基本对象的语言。

面向对像编程

1、如何获得该对象

2、如何 调用该对象

3、如何调用该对象的方法

 

对象的组成 部分：

1、属性（特征）

2、方法（行为）

 

js标签旋置位置：

1.内联

2、内部

3、外部

 

内部JS一般写在body后面，因为代码是由上往下阅读，如果 写在上面，有可能Body还没开始执行 ，还找不到标签，id等信息。

 

js注释 ：

　　//

 　 /**/

 

字符串连接符“+”:
js中使用+来连接，加号首先是连接，然后才是数学运算，如果加号两边有一个字符 为字符串就进行连接，两边都是数字才进行运算。如果 是“-"　减号，就会强行进行运算如alert(100-'5')，虽然5是字符型，但他强制运算为95。

 

js变量

1.字符串:双引号、单引号

　　str="hello world";

2.整型

　　num=10;

3.浮点

　　num=10.3;

4.布尔

　　str=false;

5.数组

　　1.var arr=[1,2,3];
　　2.var arr=new Array(1,2,3);注意大写，我在sublime小写不行。

6.对象　

　　1、DOM对象，就是document,就是标签对象

　　　　eleobj=document;

 

　　2、js 对象

　　　　obj=new Object();

　　例子：　　

　　　　obj=new Object();//对象
　　　　obj.username='user1';//对象属性
　　　　obj.age='20'
　　　　obj.sex='nan';
　　　　obj.say=function(){ //对象方法
　　　　alert('my name is user11');
　　　　}
　　　　document.write('<h1>my nameis '+obj.username+'<h1>');
　　　　document.write('<h1>my name is '+obj.age+'<h1>');
　　　　obj.say();

7.json对象:　

　　obj={'name':'user','age':'20'}

　　例子：

　　　　jsobj={'username':'user1',
　　　　　　　　'age':'20',
　　　　　　　　'sex':'nan',
　　　　　　　　'say':function(){
　　　　　　　　alert(this.sex);//this就是代表我自己(本对象)

　　　　　　　　}
　　　　　　　};
alert(jsobj.username);
jsobj.say();

8.NaN

　　not a number 不是一个数字，非数字

9.null   :js里小写

　　空,对象类型

　　str=null

　　一般用于提前规划一些变量或变量赋初值

10.undefined

　　未定义

 

 

函数

1.传统函数定义方法

　　function say(){

　　　　alert(1);

　　} 

 

2.匿名定义方法

　　say=function(){

　　　　alert(1);

　　}

 

say();//调用函数

  

变量作用域

在js中只有函数里面带var的是局部变量，其余全是全局变量！

1.全局变量
变量定义时前面如果没有var则全部都是全局变量

1、str='user1';
　　function say(){
　　　　alert(str);
　　}
　　say();

2、

　　function say(){
　　　　str='user1';
　　}

　　say();
　　alert(str);

2.局部变量
只有在函数内部前面带var的变量为局部变量，局部变量只能在函数体内使用

function say(){
var str='user1';
}

say();
alert(str);

二、第2章（5-7）

类型测试

1、typeof();//判断变量类型

　　

str="10";
if(typeof(str)=='string'){
　　alert("是字符串");
}else{
　　alert('不是字符串');
}

typeof（）可判断的类型

1.string：字符串

2.number：整型和浮点型、NaN

3.boolean:布尔型

4.object:数组 、对象、JOSON,NULL

5.underfined：underfined

#一定要注意js中所有变量都是对象，只是为了区分 才分了上面5种。

2、arr instanceof Array;//可以测试数组类型

　　arr是一个变量，数组名，

　　instanceof :不能乱写，代表是arr是不是Array实例化出来的。

　　Array：注意大写，类。

a=new Array(1,2,3);
alert(a instanceof Array);

顶级全局方法:前面不需要对象，拿来就能用，注意大小写。
• typeof();
• parseInt();强制转整型　　

　　str=''10abc;
　　alert(Number(str)+5);  NaN
　　alert(parseInt(str)+5);  15

• parseFloat();强制转浮点型
• eval();执行字符串内部表达式

　　b='a=1+1';

　　eval(b);

　　alert(a);

结果2
• Number();有了parseInt,不需要用
• String();整型转字符串
• Boolean();

　　num=10;

　　alert(Boolean(num)+5);结果为6

　　数字里除了0是假，其它都是真

　　加号如果 两边不是字符型，就做数学运算，强制改变两边类型，布尔类型真为1，假为0

在JS中前面的对象不用写的两种情况

1、Global对象（js内部对象）

• typeof();//其实它的全是Global.typeof();//用的时候 不需要加Global
• parseInt();
• parseFloat();
• eval();
• Number();
• String();
• Boolean();

2、window对象（浏览器提供的标签对象，如dom对象）

• alert();//其实它的全是window.alert();//用的时候不需要加window

变量类型转换

1.整型->字符串

1）num=10;

　　str=string(num);

2)num=10;

　　str=num+'';

2、字符串->整型

　　1)str='10px';

　　　　num=parseInt(str);

　　2)Number();现在不用了。

3、所有类型->布尔类型

1)Boolean();
2)!!data

如V ='0';

b=!!V;

4、所有类型->布尔类型（为假的情况）

1）字符串('')

2）整型(0)

3）浮点型(0.0)

4）null

5)NaN

6)undefined

如果 字符串里有个空格是真的。如a="  ";

json字符串转Josn对象

str="{'username':'user1','age':'20'}";

obj=eval('('+str+')');//加括号

alert(str);

结果：[object Object]

变量运算符：

1.+-*、%

2.in　:检查某一个属性是否是这个对象里面的，数组里判断的是下标是不是在这个数组 中。

　　1.arr=['a','b','c'];

　　　alert(a in arr);

　　2. obj={'username':'user1','age':'20'};
　　    alert('username' in obj);

3.instanceof:检查某个对象是否是由某个构造函数产生的

4.delete://删除变量，不能删除用var（局部）定义的变量

　V='abc'

　delete(V);

js语法

1.if语句　　

条件必须成立，只能命中其一，从上往下执行，从左往右执行。

　　if(){
　　}else if{
　　}else{
　　}

2.switch语句

条件只是等于，

week=5;
switch(week){
　　case 1:
　　　　alert('周一');
　　　　break;
　　case 2:
　　　　alert('周二');
　　　　break;
　　case 3:
　　　　alert('周三');
　　　　break;
　　case 4:
　　　　alert('周四');
　　　　break;
　　case 5:
　　　　alert('周五');
　　　　break;
　　case 6:
　　　　alert('周六');
　　　　break;
　　default:
　　　　alert('周日');
}　　

3.while循环

i=0;
while(i<10){
document.write('<h1>'+i+'</h1>');
i++;
}

4.for 循环

for(i=0;i<3;i++){
document.write('<h1>'+i+'</h1>');
i++;
}

5.forIn遍历:对json对象进行遍历

obj={'username':'user1','age':'20','sex':'nv'};
for(i in obj){
document.write('<h1>'+i+'->'+obj[i]+'</h1>')
}

结果

username->user1

age->20

sex->nv

解释：第一次把obj的对象第一个属性赋给i，第二次把第二个属性赋给i，第三次........，那i的值 为username,age,sex

本来属性得到值是，obj.i，但JS里规定对象.属性，对象和方法名不可以是变量，现在i是变量，所以只能写成obj[i]

例子：

九九乘法表

for(i=1;i<=9;i++){
document.write('<h3>');
for(j=1;j<=i;j++){
document.write('<span>'+j+'x'+i+'='+(j*i)+'</span> ')
}
document.write('</h3>')
}

1.普通函数
function show(){}

function out(n=9,k=1){//定义默认值
for(i=1;i<=n;i++){
　　document.write('<h3>');
　　for(j=1;j<=i;j++){
　　　　document.write('<span>'+j+'x'+i+'='+(j*i)+'</span> ')
　　}
　　document.write('</h3>')
}
for(j=0;j<k;j++){
　　document.write('<hr>');
}

}
out(3,4) //调用函数out

2.匿名函数
obj.say=function(){}

out=function(n,k){

....

}

消息框

警告框:
alert();
确认框:
confirm();

<body>
<a href="http://www.baidu.com" id='s'>百度M</a>
</body>
<script>
aobj=dogopj=document.getElementById('s');
aobj.onclick=function(){
r=confirm('你确认去百度吗？');
if(!r){
return false;
}
}
</script>

提示框:
prompt();

<body>
<a href="http://www.baidu.com" id='s'>
<img src="" id='imgid'>
</a>
</body>
<script>
imgobj=document.getElementById('imgid');//获取JS对象
r=prompt('请输入图片名字');
img=r+'.png';
imgobj.src='.png'
</script>

js对象:

1.js内置对象
2.js事件对象(js内置对象之一，因为内容庞大，特别讲一下。)
3.BOM浏览器对象
4.DOM文档对象(document)

数学对象:
1.生成对象
Math;大写

2.属性

Math.PI:圆周率

3.方法
Math.ceil();取上一个整数，不舍

alert(Math.ceil(3.14));结果为4
Math.floor();取下一个整数，不入

alert(Math.ceil(3.54));结果为4
Math.round();四舍五入

alert(Math.ceil(3.14));结果为3

alert(Math.ceil(3.14));结果为3
Math.random();取随机数（0到1之间的小数）
Math.max();取最大数

　　alert(Math.min(0,3,5));结果：5
Math.min();取最小数

　　alert(Math.mxa(0,3,5));结果：0

例子：随机展示图

arr=['a.png','b.png','c.png','d.png','e.png'];
rand=Math.random();
tot=arr.length;
sub=Math.floor(rand*tot);

imgobj=doucment.getElementById('imgid');
imgobj.src=arr{sub};