js(javascript)的总结 d2
一.javascript
1.java是编译解释型语言基于类的语言，而javascript是直译的脚本语言（运行一行读一行），是一种动态类型，弱类型的语言，内置支持类型，他的解释其是浏览器的一部分，最早用来给html增加动态功能，可以作为前端的验证和交互。他只有一个变量类型var类型，可以指定成字符串，对象，布尔。
2.js的三种使用方式以及比较。
首先，第一种直接写在<button id="btn" onclick="alert('你点我干嘛')">haa</button>，onclick就是js。这种方式将html和js写在一起了，骨架和行为分离。
其次，第二种写在html的底部或者<head>里，还是在html里不过已经将两者分开了，由于html是从上一行一行向下编译读取的，如果将html放在head里面的话，前面需要增加一些操作，即widnows onload 等操作，当页面加载完成后才执行这段代码可以很简单，这种方式用于教学。
最后一种是写在一个css文件里，在html中body里写一个脚本，再调css里，用了src，这种方式常用于工程，需要注意的是一个页面只能被加载执行一次，因此如果用到了外联css同时内部css也用到了加载，那么他只会默认选择前面的进行操作，而不会出现相同名字的替代。
第一个·为用html，第二个为第一个调的scc.js需要注意的是他们在相同文件夹下。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="scc.js"></script> <script type="text/javascript"> window.onload=function(){ var btnf=document.getElementById("btn1"); btnf.onclick=function(){ alert("你点我"); } }; </script> </head> <body> <button id="btn" onclick="alert('你点我干嘛')">haa</button> <button id="btn1" >a</button> <button id="btn2" >ff1</button> <button id="btn3" >b</button> <script type="text/javascript"> var btn1=document.getElementById("btn2"); btn1.onclick=function(){ alert("你点我啊"); } </script> </body> </html>
window.onload=function(){
var btn=document.getElementById("btn3");
btn.onclick=function(){
alert("哈哈");
}
};
用于两边都用了加载，所以在运行的时候会运行前面的也就是调用css。js而不会用到btn1相关的按钮了，因此执行会出现不兼容，要想改变必须放在一起加载或去掉一个。
3.js函数
首先明确js里的变量的命名都用var，无论是方法还是布尔，还是字符串都是一样的，这就是他与java的区别之一，这就会出现一个问题输入一个东西他到底是什么类型的，该如何判断，js里定义了一个函数也就相当于java里的类的概念，但是他不会存在函数的加载，如果存在两个函数同名，他会顺着浏览器执行，由下面的函数替换上面的函数，相当于完成了一次覆盖，如果出现了函数里的形参和实参数量不一致，也是可以运行的，但是在java里是不允许的。具体的操作如下。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> function sum(a,b){ alert(a+b); } sum(2,3); var a1=function(a,b){ return a+b; } alert(a1(4,6)); function sum2(a,b,c){ sum=a+b+c; //return有两个作用，1终止函数的执行。2将函数的结果返回给调用者。 return sum; } // 不存在重载。 alert(sum2(123,552,true)); alert(sum2(123,"aa",true)); alert(sum2(2,5,5,6)); </script> </head> <body> </body> </html>
输出的框依次是5，10，676，123aatrue，12。这个并没有提供覆盖，名字不相同。值得注意的是当 true前面接的是数字时它就会变成真也就是01中的1，而前面连接的是字符串时就会出现字符串true，这个地方只等注意。而最后一个也就忽略了6这个参数只进行前面三个参数的相加，这个在java里不允许的，是区别于java的特点，不存在重载。重载指的是，方法名相同，里面形参的数量类型或者顺序不同，或者是返回的值不同。
4.js对象
与java的类相似，定义一个对象，对象具有一些属性，通过调用一些属性来达到一些效果，是以键值对的形式保存的，键值对之间用“，”这却别与css和html“；”需要注意，他同时也可以调用函数，需要注意的是function函数需要在调用的地方的前面否则会出现没定义，然后报错。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> /* js中创建对象的两种方式： 1.var obj =new Object(); 2.var obj={}; */ var obj={}; alert(obj); /* 给对象动态的添加属性或者方法。 */ obj.name="张三"; obj.age=12; alert(obj.name); alert(obj.age); function sum(a,b){ var sum=a+b; alert(sum); } obj.fun=sum(2,3); var obj1={ name:"aa", job:"bb", school:function(){ alert("helleo"); } } alert(obj1.name); alert(obj1.job); obj1.school(); var b=function(){ alert("helleo"); } var obj2={ name:"as", job:"ss", school:b } alert(obj2.name); alert(obj2.job); obj2.school(); </script> </head> <body> </body> </html>
