1.javascript是ECMAScript的一种实现
2.数据类型
1》基本数据类型 数字 字符串 bool
2》复合数据类型 对象(自定义对象,内置对象(Array),单体对象(Math))
3》空类型 null(空指针如果你把一个值赋值为null的时候,浏览器吧这个数据
当成一个对象,只不过这个对象没有指向任何地址是一个空指针)和
undefined(未定义的值,如果这个量你定义了但是没有赋值就会赋值一个undefined)
但是这个undefined值并不安全,但是这个值并不安全,因为undefined可以再次赋值
例如:undefined=123;输出的是123
3.语句
分号分割语句,只要语句结束以后既要加上分号以便在以后开发进行压缩
JS的时候会对语句有所影响!
好的编程习惯,会遇到很少的傻瓜BUG
if语句是条件语句
循环语句:for while do-while for-in(循环枚举对象的属性)
跳转语句:goto(实际开发中少用)
分支语句:switch-case
return语句 a:return;下边代码不用再执行了,停止逻辑中断
continue语句:结束本次循环
break语句:放到switch-case语句中跳出分支语句,放到循环语句中结束循环
练习题:
//n如果类型为数字就+10并且输入如果为字符串就打印第一个字符
//如果为bool就直接打印
//否则打印该类型的每一个属性
function caishu(n){
var typeN=typeof n;//这里对代码进行了优化,会提高性能
if(typeN==="number"){
console.log(n+10);
}else if(typeN==="string"){
console.log(n.charAt(0));
}else if(typeN==="boolean"){
console.log(n);
}else{
for(var key in n){
console.log(key);
}
}
}
function caishu(n){
var typeN=typeof n;
switch(typeN){
case "number":
console.log(n+10);
break;
case "string":
console.log(n.charAt(0));
break;
case "boolean":
console.log(n);
break;
default:
for(var key in n){
console.log(key);
};
break;
}
}
4.==与===的区别
前者比较内容,隐式类型转换,字符串1==数字1
后者比较内容和类型
5.装箱和拆箱:一个基本类型为什么会有方法呢?实际上是js解析器给了一个
装箱操作:将基本数据类型包装成其对应的符合类型数据类型
拆箱:将复合数据类型转换成其对应的基本数据类型
6.sort方法参数
如果fn的返回值 大于0就交换,
小于0就不交换
等于0就保持
案例:
var arr=[{name:"zs",age:18},{name:"ls",age:19},{name:"ww",age:16}];
arr.sort(function(a,b){
return b.age>a.age?-1:1;//这里是进行的是降序排序
});
7.类型转换
数字转换成字符串:toString()\ String() \+"" \new String()
var num=123;
console.log(num);
console.log(num.toString());
console.log(String(num));
var str=new String(num).valueOf();//valueOf是变为他的原始值
console.log(str);
console.log(num+"");
性能问题:+"">String()>toString()>new String()
字符串转换成数字:Number(),parseInt(),parseFloat(),new Number,*1,/1
*1,/1>Number()>parseInt(),parseFloat()(可以自动裁剪)>new Number()
var num=new Number(str).valueOf();//valueOf是变为他的原始值
数字转换成布尔:
0转化为false,非0转化为true
布尔转换成数字:false转化为0true转化为1
字符串转化成bool:空字符串转化为false,非空字符串转化为true
bool转化成字符串:相应字符串
其他类型转化为bool
空类型为false
对象为true
8.控制台可以测试表达式的值
9.source显示源文件的内容。并且可以打断点
10.string对象常用方法
1>截取字符串substring substr(不能有负数) slice(start,end)(不包括end)(
第一个和第三个可以指定负数,倒数第一个就是-1的但是前面为负数后面不能为正数)
2>分割字符串split(",");返回值是一个数组,分割后数组的每个元素都是字符串
var str="1,2,3,4,5";
console.log(str.split(","));以逗号这个子串作为分割如果为"123,,"数组为三个元素
3>字符串元素替换replace,并且返回一个新的字符串,只能替换一个,如果替换多个就用正则
4>检索字符串indexOf()如果有的话就会返回他的索引值如果没有的话就返回-1。这里的
一个典型例题就是数组去重,还有search,但是search可以使正则表达式而indexOf不可以用正则
5>连接字符串concat,返回值是一个新的字符串
6>charAt(index):返回的是位置字母
7>match()也是可以传入正则表达式的,返回值是一个数组
11.数组对象的常用方法
push()(又不好的地方可以pushnull和undefined,所以在push的时候要判断数据类型),
pop(),
shift(),unshift,
concat,:返回的是一个新的数组,也会传入一些null和undefined
splice,:截取和替换第一个参数是起始位置第二个参数是长度,
后面的参数是替换的
var arr=[1,2,3,4,5,6];
var newArr=arr.splice(3,3,7,8,9);
console.log(arr);
var arr=[1,2,3,4,5,6];
var newArr=arr.splice(3,3);
console.log(arr);//123
slice,和splice的区别是不改变原来的数组
var newArr=arr.slice,(3,3);
console.log(arr);//123456不改变原来的数组
join,把数组中的每个元素转化为字符串
var data={name:"jim",age:18,gender:"男"};
var ret=[];
for(var k in data){
ret.push(encodeURIComponent(k)+"="+encodeURIComponent(data[k]))
}
ret.join("&");
console.log(ret);
console.log(ret.join("&"));
sort,
reverse
indexOf(),
map()(返回的是一个新的数组).arrN=arr.map(v){return v+1;}
forEach(v,i,arr);v为当前元素,i为索引,arr是当前数组
12.DOM操作属性与方法
1>属性
parentNode:获取父节点
firstChild:获取第一个子节点
1.对象的相关概念
1》概念:无序键值对的集合,一个具体事务的抽象
2>a:值面量,键值对
b:构造函数
c:工厂模式:容错率很高。所以在实际开发中比较常用
new或者不new都能正确的返回用户想要的对象,可能写法会复杂一些
function createObj(name,age,gender){
dvar obj={};//
// var obj=new Object();//这个也可以但是性能没有值面量的好
obj.name=name;
obj.age=age;
obj.gender=gender;
obj.sayhello=function(){
console.log("nihao"+name);
};
return obj;
}
var obj=createObj("zs",18,"男");
console.log(obj);
//利用以后的模板
function Person(name){
this.name=name;
}
function createPerson(name){
return new Person(name);
}
3>如果构造函数不通过new来创造一个一个对象返回的是undefined,就当普通函数调用了。
这里还会出如果是obj.name什么的就会报错,因为undefined本来就没有那么属性
2.Dom操作的属性和方法
1>属性
parentNode:获取父节点 previousSibling:获取前一个兄弟节点
firstChild:获取第一个子节点 innerHTML:获取标签内部的所有内容,返回类型为字符串
lastChild:最后一个子节点 第二个功能设置当前节点的内容
nextSibiling:获取下一个兄弟节点
childNodes:获取当前节点的所有节点包括后代节点(性能特别低) children:有兼容问题返回的是节点
nodeType:1元素 nodeType:2属性节点 nodeType:3文本节点
2>方法:都要通过父节点parentNode去调用
常用方法:appendChild(node)、insertBefore(newNode,node)newNode要插入的新节点,node是以谁为参照物
removeChild(node) 、replaceChild(newNode,node);
node.cloneNode(true|false);true为深拷贝false为浅拷贝
案例:获取当前元素的所有兄弟节点:
var dom=document.getElementById("dv");
var parent=dom.parentNode;
var elem=parent.firstChild;
var ret=[];
for(;elem;elem=elem.nextSibling){
if(elem.nodeType===1&&elem!==dom){
ret.push(elem);
}
}
console.log(ret);
2.数据类型
1》基本数据类型 数字 字符串 bool
2》复合数据类型 对象(自定义对象,内置对象(Array),单体对象(Math))
3》空类型 null(空指针如果你把一个值赋值为null的时候,浏览器吧这个数据
当成一个对象,只不过这个对象没有指向任何地址是一个空指针)和
undefined(未定义的值,如果这个量你定义了但是没有赋值就会赋值一个undefined)
但是这个undefined值并不安全,但是这个值并不安全,因为undefined可以再次赋值
例如:undefined=123;输出的是123
3.语句
分号分割语句,只要语句结束以后既要加上分号以便在以后开发进行压缩
JS的时候会对语句有所影响!
好的编程习惯,会遇到很少的傻瓜BUG
if语句是条件语句
循环语句:for while do-while for-in(循环枚举对象的属性)
跳转语句:goto(实际开发中少用)
分支语句:switch-case
return语句 a:return;下边代码不用再执行了,停止逻辑中断
continue语句:结束本次循环
break语句:放到switch-case语句中跳出分支语句,放到循环语句中结束循环
练习题:
//n如果类型为数字就+10并且输入如果为字符串就打印第一个字符
//如果为bool就直接打印
//否则打印该类型的每一个属性
function caishu(n){
var typeN=typeof n;//这里对代码进行了优化,会提高性能
if(typeN==="number"){
console.log(n+10);
}else if(typeN==="string"){
console.log(n.charAt(0));
}else if(typeN==="boolean"){
console.log(n);
}else{
for(var key in n){
console.log(key);
}
}
}
function caishu(n){
var typeN=typeof n;
switch(typeN){
case "number":
console.log(n+10);
break;
case "string":
console.log(n.charAt(0));
break;
case "boolean":
console.log(n);
break;
default:
for(var key in n){
console.log(key);
};
break;
}
}
4.==与===的区别
前者比较内容,隐式类型转换,字符串1==数字1
后者比较内容和类型
5.装箱和拆箱:一个基本类型为什么会有方法呢?实际上是js解析器给了一个
装箱操作:将基本数据类型包装成其对应的符合类型数据类型
拆箱:将复合数据类型转换成其对应的基本数据类型
6.sort方法参数
如果fn的返回值 大于0就交换,
小于0就不交换
等于0就保持
案例:
var arr=[{name:"zs",age:18},{name:"ls",age:19},{name:"ww",age:16}];
arr.sort(function(a,b){
return b.age>a.age?-1:1;//这里是进行的是降序排序
});
7.类型转换
数字转换成字符串:toString()\ String() \+"" \new String()
var num=123;
console.log(num);
console.log(num.toString());
console.log(String(num));
var str=new String(num).valueOf();//valueOf是变为他的原始值
console.log(str);
console.log(num+"");
性能问题:+"">String()>toString()>new String()
字符串转换成数字:Number(),parseInt(),parseFloat(),new Number,*1,/1
*1,/1>Number()>parseInt(),parseFloat()(可以自动裁剪)>new Number()
var num=new Number(str).valueOf();//valueOf是变为他的原始值
数字转换成布尔:
0转化为false,非0转化为true
布尔转换成数字:false转化为0true转化为1
字符串转化成bool:空字符串转化为false,非空字符串转化为true
bool转化成字符串:相应字符串
其他类型转化为bool
空类型为false
对象为true
8.控制台可以测试表达式的值
9.source显示源文件的内容。并且可以打断点
10.string对象常用方法
1>截取字符串substring substr(不能有负数) slice(start,end)(不包括end)(
第一个和第三个可以指定负数,倒数第一个就是-1的但是前面为负数后面不能为正数)
2>分割字符串split(",");返回值是一个数组,分割后数组的每个元素都是字符串
var str="1,2,3,4,5";
console.log(str.split(","));以逗号这个子串作为分割如果为"123,,"数组为三个元素
3>字符串元素替换replace,并且返回一个新的字符串,只能替换一个,如果替换多个就用正则
4>检索字符串indexOf()如果有的话就会返回他的索引值如果没有的话就返回-1。这里的
一个典型例题就是数组去重,还有search,但是search可以使正则表达式而indexOf不可以用正则
5>连接字符串concat,返回值是一个新的字符串
6>charAt(index):返回的是位置字母
7>match()也是可以传入正则表达式的,返回值是一个数组
11.数组对象的常用方法
push()(又不好的地方可以pushnull和undefined,所以在push的时候要判断数据类型),
pop(),
shift(),unshift,
concat,:返回的是一个新的数组,也会传入一些null和undefined
splice,:截取和替换第一个参数是起始位置第二个参数是长度,
后面的参数是替换的
var arr=[1,2,3,4,5,6];
var newArr=arr.splice(3,3,7,8,9);
console.log(arr);
var arr=[1,2,3,4,5,6];
var newArr=arr.splice(3,3);
console.log(arr);//123
slice,和splice的区别是不改变原来的数组
var newArr=arr.slice,(3,3);
console.log(arr);//123456不改变原来的数组
join,把数组中的每个元素转化为字符串
var data={name:"jim",age:18,gender:"男"};
var ret=[];
for(var k in data){
ret.push(encodeURIComponent(k)+"="+encodeURIComponent(data[k]))
}
ret.join("&");
console.log(ret);
console.log(ret.join("&"));
sort,
reverse
indexOf(),
map()(返回的是一个新的数组).arrN=arr.map(v){return v+1;}
forEach(v,i,arr);v为当前元素,i为索引,arr是当前数组
12.DOM操作属性与方法
1>属性
parentNode:获取父节点
firstChild:获取第一个子节点
1.对象的相关概念
1》概念:无序键值对的集合,一个具体事务的抽象
2>a:值面量,键值对
b:构造函数
c:工厂模式:容错率很高。所以在实际开发中比较常用
new或者不new都能正确的返回用户想要的对象,可能写法会复杂一些
function createObj(name,age,gender){
dvar obj={};//
// var obj=new Object();//这个也可以但是性能没有值面量的好
obj.name=name;
obj.age=age;
obj.gender=gender;
obj.sayhello=function(){
console.log("nihao"+name);
};
return obj;
}
var obj=createObj("zs",18,"男");
console.log(obj);
//利用以后的模板
function Person(name){
this.name=name;
}
function createPerson(name){
return new Person(name);
}
3>如果构造函数不通过new来创造一个一个对象返回的是undefined,就当普通函数调用了。
这里还会出如果是obj.name什么的就会报错,因为undefined本来就没有那么属性
2.Dom操作的属性和方法
1>属性
parentNode:获取父节点 previousSibling:获取前一个兄弟节点
firstChild:获取第一个子节点 innerHTML:获取标签内部的所有内容,返回类型为字符串
lastChild:最后一个子节点 第二个功能设置当前节点的内容
nextSibiling:获取下一个兄弟节点
childNodes:获取当前节点的所有节点包括后代节点(性能特别低) children:有兼容问题返回的是节点
nodeType:1元素 nodeType:2属性节点 nodeType:3文本节点
2>方法:都要通过父节点parentNode去调用
常用方法:appendChild(node)、insertBefore(newNode,node)newNode要插入的新节点,node是以谁为参照物
removeChild(node) 、replaceChild(newNode,node);
node.cloneNode(true|false);true为深拷贝false为浅拷贝
案例:获取当前元素的所有兄弟节点:
var dom=document.getElementById("dv");
var parent=dom.parentNode;
var elem=parent.firstChild;
var ret=[];
for(;elem;elem=elem.nextSibling){
if(elem.nodeType===1&&elem!==dom){
ret.push(elem);
}
}
console.log(ret);