您的位置:首页 > Web前端 > JavaScript

JavaScript入门学习笔记

2013-01-19 01:53 323 查看
1.什么是JavaSript

HTML只是描述页面长相的标记语言,没有计算,判断能力,如果所有计算,判断(比如判断文本框是否为空)都放到服务器执行的话网页的话页面会非常慢,用起来也很难用,对服务器的压力也很大,因此要求能在浏览器中执行一些简单的运算,判断.JavaScript就是一种浏览器执行的语言

JavaScript和Java没有直接关系,简称JS

JS是解释型语言,无需编译就可以随时运行,哪怕预压有错误,没有语法错误的部分还是能正确运行

csc.exe 直接把C#代码编译成.exe

2.JS的开发环境

VS中js,jq的自动完成功能

3.JS入门

<script type="text/javascript">

alert(new Date().toLocaleDateString());

</script>

JS代码可以放在,head,body任何位置

new Date()是创建一个Date类的对象

<script language="">已经不推荐使用

除了可以在页面中声明JavaScript,还可以调用外部的js文件,比如外面的js文件为Common.js文件,里面alert(new Date().toLocaleDateString());

<script src="Common.js" type="text/javascript"></script>

4.事件

在超链接的点击里执行JavaScript: <a href="javascript:alert('hello')">点点</a> <!--交给javascript引擎处理-->

当按钮被点击执行javaScript

<input type="button" onclick="alert('99')" value="久久"/>

只有超链接的href中的JavaScript中才需要加"javascript",因为它不是事件,而是把"javascript:"当成"http:","ftp:","thunder:","ed2k:"一样的网络协议,交给js引擎处理

5.js的变量

js中即可以使用双引号声明字符串,也可以用单引号声明字符串,主要方便html继承,避免转衣服的麻烦

js中有null,undefined两种,null表示变量为空,underfined则表示变量还没有指向任何对象,未初始化.两者的区别参考资料

js是弱类型,声明变量的时候无法:int i=0; 只能通过var i=0;声明变量,和C#中的var不一样,不是c#中哪样的类型判断

js也可以不用var声明变量,直接用,这样的变量时"全局变量",因此除非却是想用全局变量,否则使用的时候最好加上var

在js里面是没有承认的全局变量,不要不加var

js是动态类型,因此var i=0; i="abc";是合法的

6.js中的调试

加断点,在vs环境下调试

7.判断变量初始化

js中判断变量,参数是否非初始化的三种方法

var x;
if (x
== null )
{
[align=left] alert( "null")[/align]
[align=left] }[/align]
if (typeof (x)
== "undefined")
{
[align=left] alert( "undefined");[/align]
[align=left] }[/align]
if (!x)
{ alert('不x' );
} //推荐,简单
8.函数的声明

function add(i1, i2){

return i1+i2;

}

int add(int i1,int i2) //C#中的写法

最好把声明放在前面,效率比较高

alert(add(1,4));

在js中不存在函数必须有返回值,如果没有就返回undefined

9.匿名函数

var f1 = function (i1,
i2) {
return i1
+ i2;
[align=left] };[/align]
[align=left] alert(f1(5, 6));[/align]
避免函数名冲突的问题

10.js的面向对象

js中没有类的语法,使用函数闭包(closure)模拟出来的,下面讲解的还是用c#中的类,构造函数的概念,js中的String,Date

<script type="text/javascript">
function Person(name,
age) {//声明一个函数,来模拟类
this.Name
= name; //this什么含义,动态对象,动态增加的属性
this.Age
= age; //dynamic d=new ***ExpendoObject(); d.Name="tom"; d.Age=30;
this.Hello
= function ()
{
[align=left] alert( this.Name);[/align]
[align=left] }[/align]
[align=left] }[/align]
var p1
= new Person("tom",
30);
//var
p1 = Person('tom',30); //不要丢了new,否则返回undefined
[align=left] p1.Gender = "男"; //也可以在外面增加动态属性[/align]
[align=left] p1.Hello();[/align]
[align=left] </script>[/align]
必须声明类名,function

11.Array对象

js中的Arry对象就是数组,首先是一个动态数组,而且是一个像c#中的数组,arryList,Hashtable等的超强综合体

var names = new Array();
[align=left] names[0] = "tom";[/align]
[align=left] names[1] = "jerry";[/align]
[align=left] names[2] = 'lily';[/align]
[align=left] names[3] = 123;[/align]
[align=left] names[3] += 1;[/align]
for (var i
= 0; i < names.length; i++) {
[align=left] alert(names[i]);[/align]
[align=left] }[/align]
无需预先定制大小,动态,类型也是动态的

12.Arry练习
function getMax(arr)
{
var max
= arr[0];
for (var i
= 0; i < arr.length; i++) {
if (arr[i]
> max) {
[align=left] max = arr[i];[/align]
[align=left] }[/align]
[align=left] }[/align]
[align=left] return max;[/align]
[align=left] }[/align]
var arr1
= new Array();
[align=left] arr1[0] = 20;[/align]
[align=left] arr1[1] = 10;[/align]
[align=left] arr1[2] = 30;[/align]
[align=left] alert(getMax(arr1));[/align]
[align=left]13.练习[/align]
[align=left] //矩阵翻转[/align]
function TurnArry(a)
{
[align=left] var temp;[/align]
for (var i
= 0; i < a.length / 2; i++) {
[align=left] temp = a[i];[/align]
[align=left] a[i] = a[a.length - i - 1];[/align]
[align=left] a[a.length - i - 1] = temp;[/align]
[align=left] }[/align]
[align=left] }[/align]
var arr
= new Array();
[align=left] arr[0] = "1";[/align]
[align=left] arr[1] = '2';[/align]
[align=left] arr[2] = '3**';[/align]
[align=left] TurnArry(arr);[/align]
for (var i
= 0; i < arr.length; i++) {
[align=left] alert(arr[i]);[/align]
[align=left] }[/align]
[align=left]将一个字符串数组输出为' | '分割的形式,比如"梅西|卡卡|李白", arr1.jion('|');将数组分割符连接成一个字符串[/align]
[align=left] //我??的??join[/align]
function myjoin(arr)
{
if (arr.length
<= 0) {
[align=left] return '' ;[/align]
[align=left] }[/align]
var s
= arr[0];
for (var i
= 1; i < arr.length; i++) {
s += '|' +
arr[i];
[align=left] }[/align]
[align=left] return s;[/align]
[align=left] }[/align]
var arr
= new Array();
[align=left] arr[0] = "1";[/align]
[align=left] arr[1] = '2';[/align]
[align=left] arr[2] = '3**';[/align]
[align=left] alert(myjoin(arr));[/align]
[align=left]14.Js中的Dictionary'[/align]
[align=left] js中的arry是一个宝贝,不仅是一个数组,还是一个dictionary,还是一个Stack[/align]
var dict
= new Array();
dict[ "人"]
= "ren" ;
dict[ "口"]
= "kou" ;
dict[ "手"]
= "shou" ;
[align=left] alert(dict[ "口"]);[/align]
[align=left] alert(dict.口);[/align]
for(var k in dict)
{ //js中的foreach语法,遍历主键
[align=left] alert(k);[/align]
[align=left] } [/align]
[align=left] 结果是遍历了,人,口,手[/align]
[align=left] 数组用法只是一个dictionary的用法的一个特例,取出的是主键[/align]
[align=left] 自己:感觉投机取巧一点,可以alert(dic[k]);这样就可以遍历全部了[/align]
[align=left]15.Array的简化声明[/align]
var arr
= [3, 5, 6, 7, 8]; //普通数组初始化
var arr1
= { "tom" :
30, "lily": 20
}; //dictionary
[align=left] alert(arr1[ "lily"]);[/align]
[align=left]16.数组,for,以及其他[/align]
[align=left] //获得对象所有的成员,为什么可以获得呢?对象的成员就是以对象的key的形式出现的[/align]
for (var e in document)
{
[align=left] alert(e);[/align]
[align=left] }[/align]

var p1
= new Person();
[align=left] p1.Age = 10;[/align]
[align=left] p1.Name = "df";[/align]
[align=left] p1.SayHello = function(){alert("dgf" );}; //外部动态生成对象[/align]
for (var e in p1)
{ //遍历所有对象,成功出现Name,Age,Hello,SayHello
[align=left] alert(e);[/align]
[align=left] }[/align]
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: