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]
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]
相关文章推荐
- (清华大学HTML+CSS+JavaScript入门到精通学习笔记)第一章 网页设计基础
- 20150727 JavaScript入门学习笔记
- javaScript学习笔记---入门
- JavaScript入门学习笔记(最后的代码)
- JavaScript入门学习笔记(2)—— 引用类型
- (清华大学HTML+CSS+JavaScript入门到精通学习笔记)第二章 HTML基础
- 零基础入门-javascript学习笔记之传说中的闭包
- 【安全牛学习笔记】Javascript入门
- JavaScript学习笔记[1]---入门
- JavaScript学习笔记 - 入门篇(1)- 准备
- 学习笔记:JavaScript-入门篇
- [知了堂学习笔记]_JavaScript入门
- javascript入门学习笔记2
- Javascript:Javascript教程,javascript入门,学习笔记
- [学习笔记]JavaScript[0]-入门
- Java学习笔记--javascript入门
- JavaScript学习笔记 - 入门篇(2)- 常用互动方法
- [知了堂学习笔记] javascript入门
- javascript入门学习笔记
- JavaScript入门学习笔记(1)—— 基本概念