JavaScript笔记誊录

标签：

js:一种脚本语言、客户端语言
1、代码都写在<script></script>标签中
2、外部引用<script type="text/javascript" src=""></script>
变量命名规则
-> 严格区分大小写
->与C#类似，多一个，可以使用$开头

大小写敏感，弱类型var
-> 注释    // 与 /**/    (<!--  -->)
-> 需要写JS，代码都写在<script>标签中
-> 在JS中弹出对话框使用
-> alert(‘弹出的内容‘)
-> 字符串建议使用单引号(使用双引号也对)
-> 如果想要弹出，当前日期，使用
alert(new Date().toLocaleDateString());

如果变量内外部冲突，以内部的局部变量为主
如果一个变量没有定义var,直接使用，浏览器会把它当作全局变量使用
<script type="text/javascript">
num=11;//变量没有生命直接使用，当全局变量使用
aletr(num);
var num=10;//生命并赋值
alert(num);
</script>

2、由于js是弱类型，因此非常容易出现数字计算的时候，变成字符串的拼接

数字转化：
数字转换成字符串：var num=132+"";
                alert(1+num);
字符串转化数字为：parseInt(): parseInt("123adw23")//结果是123，从中提取数字，然后转化(注意此时只提取并转化了第一个数字1)

javascript数据类型：6
Boolean(布尔)、Number(数字)、Null(空)、Undefine(未定义)、Object(对象类型)、string(字符串)

出了Object是引用类型以外，其他都是基本数据类型
Undefined类型、Null类型都是只有一个值的数据类型，分别为undefined与null.
Null：表示变量指向的对象为空，表示赋给变量的值为空，空是一个有特殊意义的值
undefined:表示变量还没有被赋值或对象的某个属性不存在，还没有对变量赋值，变量还处于未知状态
String也是基本类型，不能为String添加动态属性，而引用类型时可以的。

JS中的null与undefined：
-> undefined表示不知道
1、声明没初始化，则为undefined
2、方法没有明确返回值的时候，返回undefined
3、对没声明的变量应用typeof运算符时，显示为undefined
定义变量，但没有赋值
-> 方法没有返回值
对于JS中的方法返回值，直接在方法体中return，不需要再定义的时候写返回类型
->使用typeof运算符
显示的均是字符串
使用if判断(typeof(x) == ‘undifined’)

-> null表示没有
1、null表示不存在的对象
2、null是有特定意义的值
3、可以为变量赋值null
似乎浏览器认为null就是undefined

typeofy运算符：
typeof()//获取变量类型，
//根据赋值的变量类型来判断，没有定义(没赋值)的返回undefined,等于null，类型返回NULL
显示的均是字符串
在if语句中使用typeof进行判断时，要加字符串
使用if判断（typeof(x)==‘undefined‘）

var b=true;
if(typeof(b)=="boolean"){
alert("是布尔类型");
}
else{
aletr("不是布类型");
}

定义方法:
function 方法名() {
    // 方法体
}

带参数的函数定义
function 函数名(参数名) {
    // 函数体
    [return 返回值;]
}

函数与方法没有重载，调用的时候就近原则

匿名函数：如果只需要使用一次

1、使用变量指向方法
var func=function()//直接把方法赋值给一个变量
{
 alert("我是匿名方法！");
}
使用变量指向方法
var func = function() {
}
2、定义的同时调用
(function()
{
 alert(‘123‘);
})();
3、内置的函数Function()
//var myFunc()=new Function(n,"alert(n);")；//有错误
//myFunc(13)//有错误

var myFunc()=new Function("alert(‘哈哈‘);")；
myFunc();
//Function对象可以带很多参数，前面的参数全是方法参数
最后一个参数是“方法体”
Jqueryz中大量使用

第一种，使用变量指向方法

<script type="text/javascript">
        var f = function(p) {
            alert(p);
        }
        f(10);
    </script>

    常用的地方
    document.getElementById(‘btn‘).onclick=function(){}
第二种，定义的同时调用

<script type="text/javascript">
        (function(p) {
            alert(p);
        })(‘哈哈‘);
    </script>

第三种，使用内置的一个对象Function

<script type="text/javascript">
        var f = new Function(‘p1‘,‘p2‘,‘return p1 + p2‘);
        alert(f(3,2));
    </script>

arguments对象:
js中函数与方法没有重载，调用的时候就近原则,如果要传多个参数时，可以使用arguments对象
-> 若需多个参数，则使用argument对象
-> 使用
-> 定义方法，圆括号中不带参数
-> 在方法中使用arguments当做是参数数组，可以带任意个差数
-> 使用length获得参数长度
-> 调用的时候把参数传给arguments
-> 调用的时候没传参数，就没有返回的值，但是不报错

function paramasFunc()
 {
   var str="";
   for(var i=0;i<argumets.lenght;i++)
   {
     str+=arguments[i]+"|";
   }
   return str;
 }
  paramasFunc("adw","21",2,ture);//调用的时候把参数传给arguments

JavaScript中的系统函数：
-> encodeURI、 decodeURI
var urlStr = encodeURI(“string”);
-> parseInt、 parseFloat
var num = parseInt(“123”)
-> isNaN
-> escape、 unescape
var codeStr = escape(“string”);
-> (*)eval
eval(“js 代码”);

NaN表示not a number
isNan:判断是不是非数字，不是数字(非数字)返回true,是数字返回false
var n=isNaN("awd");
  alert(n);

eval("js代码");//相当于调用一个函数，执行里面的js代码,动态运行用户写的js代码
eval("var i=10;i=i+10;alert(i)");

encodeURI:加密编码URI
var str="我是黄建胜";
str=encodeURI(str);
decodeURI:解密URI
var strs=decodeURI("@!#213@#FE!@#");//解码

escape(加密)/unescape（解密）

 
null与undefined是判断有兼容性的//0表示假
在IF判断中那些null、空、undefine等均表示false
 

var num=null
 if(num==null)
 {
  alert("不为空");
 }
 else
 {
 alert("为空！");
 }

alert(‘c:\\windows‘);表示一个 alert(\‘num\‘);前面加个\表示一个单引号
 alert(行三\r\n);表示换行符
 
 substr(3,5)//表示从第3个索引的位置开始截取5长度的字符串
 substring(3,5)//表示从第3个索引位置到第5个索引的位置，不包括第5个位置

javascript中提供了2个对于对象的语句
1、with语句：

with(对象名)
{
执行的语句块
}

如果一段连续的代码中，多次出现使用到某个对象的属性或方法，那么只要在with关键字后面的小括号中写出这个对象的名称
然后就可以在随后的大括号中的执行语句里直接引用该对象的属性名和方法名，不必再
每个属性和方法名前面加对象的实例名和（.）了

<script type="text/javascript">
  var datetime=new Date();
  with(datatime)
  {
  //var strdate=datetime.getYear()+"年"；
   var strdate=getYear()+"年"；//省略了对象的实例和.
   strdate+=getMonth()+"月"；
   strdate+getDate()+"日"；
   strdate+=getHours()+":";
   strdata+=getMinutes()+":";
   strdate+=getSeconds();
  }
</script>

2、for..in

for(变量 in 对象)
{
  执行语句；
}

该语句的功能是用于对某个对象的所有属性进行循环的操作，它将一个对象的所有 属性名称逐一
赋值给一个变量，根本不需要事先征得对象的个数

<script type="text/javascript">
  function Person()
  {
    this.name="黄建胜";
    this.age=20;
    this.gender="男"；
  }
  var p1=new Person();
  var str="";
  for(var item in p1)
  {
    str+=item+" "+p1[item]+" ";//item是属性，p1[item]是属性的值
    //输出的是:name 黄建胜 age 20..
  }
  alert(str);
</script>

数组：数组列表表示一组数据的集合，其中的元素可以是任意的数据类型
定义的方式：

var arr=new arr();
var arr=new arr("12","awd",12);
var arr=[1,23,213,23,"213",‘2‘];
var arr=new arr(5);//定义长度为5的数组

使用索引来赋值和取值,
数组类表中的每个元素既可以使有效的javascript表达式，也可以说空（2个相连的逗号）
如果元素为空，该元素的值为undefined

var arr=[[1,,,,5];//只有0和4被初始化

var arr=["ad",‘d‘,12];
var str="";
for(var item in arr)
{
  str+=item+":"+arr[item]+"\n";
}
for(var i=0;i<=arr.length;i++)
{
 str+=arr[i]+" ";
}
alert(str);

如果数组元素本身又是数组 ，就叫做数组的数组
//访问 数组中子数组的元素

arr arr=[["name","bende","max"],["age",20,23]];
for(var i=0;i<arr.length;i++)
{
  for(var j=0;j<arr[i].length;j++)
  {
    alert(arr[i][j]);
  }
}

String对象：
两种常见的方式：

var myString="this is my string";
var myString= new Sring("this is my string");

1、字符串相加（拼接）；
使用加号+，+=

myString+="<br>";
myString=myString+"<br>";

2、在字符串中使用单引号、双引号及其他特殊字符
javascript中字符串可以使用单引号，也可以使用双引号，但是前后必须一致。
  (1)如果字符串中需要加入引号，可以使用与字符串的引号不同的引号

var str=‘"Username" is invalid‘;

var str=\"Username\" is invalid;

var str="12123";
      var i=parseInt(str,10);//(要转化的字符串，要转换成几进制)把str转化为10进制整数：12123
      var d=parseFloat(str);//转化为浮点数
      alert(i);
      alert(d);

4、string对象的采用属性和方法：
   

//var str="abdwwdwd";
      //alert(str.length);//获取字符串的长度
      //alert(str.charAt(0));//获取字符串第0个索引位置的字符
     // alert(str.substr(1,2));//（索引位置，长度）从第“1”索引位置开始截取，长度为2的字符串
     //alert(str.substr(1))//如果没有结束位置，则从开始的索引位置截取到最后
     // alert(str.substring(1,2));//（开始的索引位置，结束的索引位置（不包括该位置））从第“1”个索引位置开始截取到第“2”个位置，不包括第“2”个索引位置字符串
     // var i=str.indexOf(‘d‘,0);//(要查找的字符，收索开始的索引位置),返回该字符的从左到右的第一个索引位置
      //var i=str.indexOf(‘b‘);//要查找的字符，从头开始找，返回找到的第一个索引位置
     // alert(i);
     
     //var str="this is a sample";
     //var a=str.split(" ")//使用分割符分割字符串到一个数字中 a[0]:this,a[1]:is....
     //str= str.replace("sample","apple");//(需替换的字符串，新字符串)
     // alert(str);
            
      //var str="12123";
      //var i=parseInt(str,10);//(要转化的字符串，要转换成几进制)把str转化为10进制整数：12123
      //var d=parseFloat(str);//转化为浮点数
      //alert(i);
      //alert(d);
      
      //循环查找字符串中相同的字符，并输出所在位置
      /*
      var str="adnadwd";
      var i=-1;
      do
      {
       i=str.indexOf(‘d‘,i+1);
       if(i!=-1)
       {
        alert(i);
       }
     }while(i!=-1);
*/

String对象：
-> length字段
字符的个数(不是字节)
-> charAt(index)
获得index处的字符，字符索引也从0开始
-> indexOf(‘字符串‘, startIndex)
返回指定字符串的位置，第二个参数表示从第几号位置开始找
-> split(‘分隔符‘, limit)
第二个参数表示返回数组的上限
-> substr(startIndex, len)
-> substring(startIndex, stopIndex)
不含stopIndex处的数据
-> match()、replace()、search()

<script type="text/javascript">
    var str = ‘a|b|c|d|e|f|g‘;    // str是一个字符串
    var strs = str.split(‘|‘);    // strs是一个数组
    // 直接打印
    alert(strs);                // 结果是将所有结果用“,”隔开，一起输出
    // 可以遍历
    // 注意遍历时，length是针对数组而言的，由于是弱类型，必须要回手写
    for(var i = 0; i < strs.length; i++) {
        alert(strs[i]);
    }
    // 如果slipt后面哟第二个参数，表示返回数组的元素个数
</script>

面向对象：
-> js没有对象，利用函数闭包模拟出来的
-> 定义
-> 定义一个方法
-> 方法中直接使用this.成员
-> 使用定义匿名方法来定义方法
-> 定义一个方法就好比定义了一个类
-> 使用“方法名()”则当做方法用
-> 使用“new 方法名()”则创建对象

类定义的简化写法：
-> 定义类，就什么也不写
-> 要用的时候，直接使用，用过一次后，后面就可以访问调用了
-> 弱类型不检查语法
->定义与初始化可以看做同一个概念
->对象成员的访问，可以类似与键值对的键一样，可以直接通过索引获得
->可以为定义对象的那个函数定义参数，就可以理解为构造函数
   

<script type="text/javascript">
            function Car() {                            // 定义一个汽车类
            }
            var myCar = new Car();                        // 得到一个汽车对象
            myCar.Brand = ‘法拉利‘;                        // 定义一个品牌字段
            myCar.Price = 6000000;                        // 定义一个价格字段
            myCar.showInfo = function () {                // 定义一个方法
                alert(this.Brand + ‘ ‘ + this.Price);
            }
            // 下面开始调用
            myCar.showInfo();
        </script>

=============================

<script type="text/javascript">
        function Student(name, age, gender) {
            this.Name = name;
            this.Age = age;
            this.Gender = gender;
            
            this.sayHello = function () {
                alert(this.Name + ‘ ‘ + this.Age + ‘‘ + this.Gender);
            }
        }
        
        var student = new Student(‘张三‘, 24, ‘女‘);
        student.sayHello();
    </script>

创建动态函数：
-> 有了面向对象创建函数可以使用Function对象
-> 基本语法：
var varName = new Function(argument1, ..., lastArgument);
-> 前面的参数为函数参数，最后一个为函数体

Array数组：
->在JS中数组极其强大
-> 是一个数组、键值对、栈等的综合体
-> 是动态的，而且不考虑类型
-> 定义
var arrNames = new Array();
-> 成员是动态的，通过下标赋值
arrNames[index] = value;
-> 使用for循环
for(var i = 0; arrNames.length; i++) …
-> 使用for-in循环
for(var key in arrNames) …
-> for-in循环遍历的是索引(或键)
-> 对象的成员可以看做键，因此也可以使用for-in遍历
-> 数组的其他声明方式
-> new Array(ele1, ele2, ele3, …);
-> new Array(size);
-> var arr = [ele1, ele2, ele3, …];

遍历一个对象中成员
   

<script type="text/javascript">
        function Person() {
            this.Name = ‘yzk‘;
            this.Age = 18;
            this.Gender = ‘男‘;
        }
        var p = new Person();
        for(var key in p) {
            alert(p[key]);
        }
    </script>

测试一下循环window对象
   

<script type="text/javascript">
        var count = 0;
        for(var key in window) {
            document.write(key + ‘<br />‘);
            count++;
        }
        document.write(‘总共有‘+count+‘个属性‘);
    </script>

JS中的Dictionary：
->定义使用数组，初始化时使用“键”，而非数字
->键值对只能使用for-in遍历
-> 可以将键值对集合看做一个对象，其键就是字段
-> obj[key] 等价于 obj.key
-> 简单的创建字典
var dir = {ket1:value1, key2:value2, key3:value3, …}
该处理方式又叫Json对象(ajax)
建议使用双引号，避免问题
-> 扩展的Json对象数组
var dics=[{ "name":‘张三‘,"age":18 },{ "name":‘李四‘,"age":19 }];

扩展方法：
-> 通过对象的prototype设置扩展方法
->以String为例
var name = ‘BillGates‘;
// 为String对象原型添加一个方法

String.prototype.AddWJX = function () {
    return ‘☆‘ + this + ‘☆‘;
}

// 下面就可以调用了

name = name.AddWJX();
alert(name);

JS中的转义符：
-> 使用中与C#和正则表达式类似
-> 但是不能使用@

<script type="text/javascript">
    alert(‘C:\\Windows\\System32\\pro.dll‘);
    alert(‘变量\‘num\‘是一个数字‘);
    alert(‘姓名：张三\r\n性别：男‘);
</script>

JS中错误与调试(IE8直接调试，或使用VS)：
-> 调试可以使用IE开发人员工具
-> 使用Chrome或FireDebug等
-> 注意
IE6中需要设置一下：
Internet选项 -> 高级 -> 去掉“禁用脚本调试”
在VS中调试：
设置启动页面 -> 默认config设置 -> F5运行调试(不能在浏览器中打开)
IE8开发人员工具：
启动页面 -> 开启开发人员工具 -> 选择js脚本 -> 设断点 -> 启动调试 -> 刷新

JavaScript笔记誊录

标签：

原文地址：http://www.cnblogs.com/hetong/p/4852418.html