0. 好习惯    分号  ;  花括号 {}, var   弄清楚 null  , undefined  区别 , isNaN, === 与  == 区别
1. prompt , confirm , alert 不同框框
数组常用方法
var arr = [10, 20, '30', 'xyz'];
arr.indexOf(10); // 元素10的索引为0
arr.indexOf(20); // 元素20的索引为1
arr.indexOf(30); // 元素30没有找到,返回-1
arr.indexOf('30'); // 元素'30'的索引为2 var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0, 3); // 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C']
arr.slice(3); // 从索引3开始到结束: ['D', 'E', 'F', 'G']
push和pop
push()向Array的末尾添加若干元素,pop()则把Array的最后一个元素删除掉:
var arr = ['B', 'C', 'A'];
arr.sort();
arr; // ['A', 'B', 'C'] unshift和shift
如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉: var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
// 从索引2开始删除3个元素,然后再添加两个元素:
arr.splice(2, 3, 'Google', 'Facebook'); // 返回删除的元素 ['Yahoo', 'AOL', 'Excite']
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
// 只删除,不添加:
arr.splice(2, 2); // ['Google', 'Facebook']
arr; // ['Microsoft', 'Apple', 'Oracle']
// 只添加,不删除:
arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因为没有删除任何元素
arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle'] var arr = ['A', 'B', 'C', 1, 2, 3];
arr.join('-'); // 'A-B-C-1-2-3' 2. 如果if的条件判断语句结果不是true或false怎么办 JavaScript把null、undefined、0、NaN和空字符串''视为false,其他值一概视为true 3. //三种方式遍历数组
'use strict';
var arr = ['小明', '小红', '大军', '阿黄'];
arr.sort().forEach(function(name){
console.log("欢迎 "+name);
}); 'use strict';
var arr = ['Bart', 'Lisa', 'Adam']; for(var i=0;i<arr.length;i++){
alert(arr[i]);
} for(var name of arr){
console.log(name);
} arr.foreach(function(name){
console.log(name);
}); //Set 与 Map 的遍历 var userSet=new Set(["user1","user2","user3"]);
for(var user of userSet){
console.log(user);
} var userInfoMap=new Map([['jimi',12],['tom',17]]);
for(var userInfo of userInfoMap){
console.log(userInfo[0]+'--><--'+userInfo[1]);
}
4. 判断本身自己有的属性,去掉继承过来的属性 如 Object 的 toString 等等
var person={
name:"闹着玩",
age: 18
}
for(var prop in person){
if(person.hasOwnProperty(prop))
console.log(person[prop]);
} 5. 函数 与 错误处理 (异步函数的错误只能够在内部捕获,外层包裹 try catch 并不会有什么卵用)
var abc=function(num){
if(typeof num !='number'){
throw new Error('not a number');
}
else{
if(num>=0){
return num;
}
else
return -num;
}
};
try{
//abc('ssf');
alert(abc(-129));
}
catch(err){
console.log(err.message);
} 6. 变量申明提升,赋值不会提升
我们在函数内部定义变量时,请严格遵守“在函数内部首先申明所有变量”这一规则。最常见的做法是用一个var申明函数内部用到的所有变量:
function foo() {
var
x = 1, // x初始化为1
y = x + 1, // y初始化为2
z, i; // z和i为undefined
// 其他语句:
for (i=0; i<100; i++) {
...
}
} 7. JSON 序列化生成字符串与反序列化生成对象
var xiaoming = {
name: '小明',
age: 14,
gender: true,
height: 1.65,
grade: null,
'middle-school': '\"W3C\" Middle School',
skills: ['JavaScript', 'Java', 'Python', 'Lisp']
}; var s = JSON.stringify(xiaoming);
var person=JSON.parse(s);
console.log('name: '+person.name);
console.log(s); var arr = [1, 2, 3]; 其原型链是:
arr ----> Array.prototype ----> Object.prototype ----> null 函数也是一个对象,它的原型链是:
foo ----> Function.prototype ----> Object.prototype ----> null function Person(name){
this.name=name;
this.hello=function(){
alert('Hello '+this.name+' !');
}
}
var person=new Person('frank');
var personStr=JSON.stringify(person);
alert(personStr); 由于Function.prototype定义了apply()等方法,因此,所有函数都可以调用apply()方法。
很容易想到,如果原型链很长,那么访问一个对象的属性就会因为花更多的时间查找而变得更慢,因此要注意不要把原型链搞得太长。
7. map /reduce var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var result=arr.map(function pow(x) {
return x * x;
});
alert(result); 'use strict'; function product(arr) {
return arr.reduce(function multi_all(x,y){
return x*y;
});
} // 测试:
if (product([1, 2, 3, 4]) === 24 && product([0, 1, 2]) === 0 && product([99, 88, 77, 66]) === 44274384) {
console.log('测试通过!');
}
else {
console.log('测试失败!'); 'use strict'; function string2int(s) {
var strArray=s.split("");
return strArray.map(function(x){
return +x;
})
.reduce(function(x,y){
return (x*10)+y;
});
} // 测试:
if (string2int('0') === 0 && string2int('12345') === 12345 && string2int('12300') === 12300) {
if (string2int.toString().indexOf('parseInt') !== -1) {
console.log('请勿使用parseInt()!');
} else if (string2int.toString().indexOf('Number') !== -1) {
console.log('请勿使用Number()!');
} else {
console.log('测试通过!');
}
}
else {
console.log('测试失败!');
} ////////------------------------==================
'use strict'; var arr = ['1', '2', '3'];
var r;
r = arr.map(parseInt); console.log(r); 结果竟然是1, NaN, NaN,小明百思不得其解,请帮他找到原因并修正代码。
提示:参考Array.prototype.map()的文档。
由于map()接收的回调函数可以有3个参数:callback(currentValue, index, array),通常我们仅需要第一个参数,而忽略了传入的后面两个参数。不幸的是,parseInt(string, radix)没有忽略第二个参数,导致实际执行的函数分别是:
parseInt('0', 0); // 0, 按十进制转换
parseInt('1', 1); // NaN, 没有一进制
parseInt('2', 2); // NaN, 按二进制转换不允许出现2
可以改为r = arr.map(Number);,因为Number(value)函数仅接收一个参数。 x=>parseInt(x) 8. 高阶函数 filter
'use strict';
var arr=[];
for(let i=0;i<10;i++){
arr.push(i);
}
alert(arr.filter(function(element){
return element % 2===0;
})); 'use strict';
function add(x,y,f){
return f(x)+f(y);
}
alert('result: '+add(-5,6,Math.abs)); 9. filter 'use strict';
var arr = ['A', '', 'B', null, undefined, 'C', ' '];
alert(arr.filter(function(s){
return s && s.trim();
})); 'use strict'; var
r,
arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
r=arr.filter(function(element,index,self){
if(self.indexOf(element)===index){
return true;
}
else return false;
}); console.log(r.toString());
去除重复元素依靠的是indexOf总是返回第一个元素的位置,后续的重复元素位置与indexOf返回的位置不相等,因此被filter滤掉了。
// ---------------=================-------------------
'use strict'; function get_primes(arr) { return arr.filter(
function(element){
if(element===1) return false;
else{
for(var i=2;i<element;i++){
if(element%i===0) return false;
}
return true;
}
}
);
} // 测试:
var
x,
r,
arr = [];
for (x = 1; x < 100; x++) {
arr.push(x);
}
r = get_primes(arr);
if (r.toString() === [2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31, 37, 41, 43, 47, 53, 59, 61, 67, 71, 73, 79, 83, 89, 97].toString()) {
console.log('测试通过!');
} else {
console.log('测试失败: ' + r.toString());
} 排序算法
排序也是在程序中经常用到的算法。无论使用冒泡排序还是快速排序,排序的核心是比较两个元素的大小。如果是数字,我们可以直接比较,但如果是字符串或者两个对象呢?直接比较数学上的大小是没有意义的,因此,比较的过程必须通过函数抽象出来。通常规定,对于两个元素x和y,如果认为x < y,则返回-1,如果认为x == y,则返回0,如果认为x > y,则返回1,这样,排序算法就不用关心具体的比较过程,而是根据比较结果直接排序。
'use strict'; var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y) {
return -1;
}
if (x > y) {
return 1;
}
return 0;
});
console.log(arr); // [1, 2, 10, 20] var arr = ['Google', 'apple', 'Microsoft'];
arr.sort(function (s1, s2) {
x1 = s1.toUpperCase();
x2 = s2.toUpperCase();
if (x1 < x2) {
return -1;
}
if (x1 > x2) {
return 1;
}
return 0;
}); // ['apple', 'Google', 'Microsoft']

原生JS基础总结

05-11 18:10