Python文集让前端飞Web前端之路

2017.12.9-学习笔记:js基础知识点整理

2017-12-09  本文已影响226人  bixin

前言:古人云,温故而知新,把自己学习js的基础笔记整理一下,有错误之处还望指出,谢谢。

→点我去看js进阶知识点整理

→点我去看jQuery知识点整理

→点我去看dom知识点整理

JavaScript基础

Js是客户端脚本语言,最初的目的是为了处理表单验证。

1.Js组成部分:
2.Js书写位置:

内嵌式:<script></script>;
外链式:<script src="main.js"></script>。

3.变量(标识符):用来在内存中存储数据。
4.数据类型
5.运算符

1.当比较数字和字符串时,字符串会转换成数字值。
2.如果其中一个操作数为布尔类型,那么布尔操作数如果为true,那么会转换为1,如果为false,会转换为整数0

x y == ===
0 false true false
"" false true false
"" 0 true false
"0" 0 true false
"17" 17 true false
null undefined true false
null 0 false false
null false false false
undefined false false false
0 NaN false false
"foo" NaN false false
NaN NaN false false

注意:NaN != NaN 的时候返回的是true
与NaN比较的都将返回false。
在比较相等性之前,null 没有被转换为其他类型
面试题:null == undefined ?以及object.is()区别

6.流程
switch (expression) {
  case 常量1:
    语句;
    Break;
  case 常量2:
    语句;
    Break;
  default:
    语句;
    break;
}

// break 可以省略,如果省略,代码会继续执行下一个case(造成case穿透)
// switch 语句在比较值时使用的是全等0.操作符, 因此不会发生类型转换(例如,字符  串'10' 不等于数值 10)

布尔类型的隐式转换:流程控制语句会把括号里的值隐式转换为布尔类型。
例举 3 种强制类型转换和 2 种隐式类型转换?
1.强制(parseInt(),parseFloat(),Number())
2.隐式(== ,console.log(),alert())

7.断点调试:
8.数组Array:

冒泡排序:
外循环控制趟数,内循环控制每趟的次数,判断相邻两个值的大小,大的放后面;
1.前一个和后一个比较,把较大的值放到后面的位置上;
2.每一趟比较次数递减;

9.函数:
function fn(){ 
  console.log('fn函数的执行代码'); 
  function fnSon(){ 
    console.log('fnSon函数的执行代码'); 
  } 
  return fnSon;//undefiend 
} 
var result = fn();//0x0011 
result(); 
var fn = function(){ 
  console.log('函数表达式的内容'); 
} 
fn();
10.作用域:变量可以起作用的范围
11.对象:存储数据的一种方式,无序的键值对的集合。

创建对象:

Var 变量名 = {
  属性name: 'zs’,
  方法sayHi: function () {
    console.log(this.name);
  }
};
function Person(name,age,job){
  this.name = name;
  this.age = age;
  this.job = job;
  this.sayHi = function(){
    console.log('Hello,everyBody');
  }
}
var p1 = new Person('张三', 22, 'actor');
var person = new Object();
  person.name = 'lisi';
  person.age = 35;
  person.job = 'actor';
  person.sayHi = function(){
  console.log('Hello,everyBody');
}
function createPerson(name, age, job) {
  var person = new Object();
  person.name = name;
  person.age = age;
  person.job = job;
  person.sayHi = function(){
    console.log('Hello,everyBody');
  }
  return person;
}
var p1 = createPerson('张三', 22, 'actor');

New关键字:

This关键字:this在构造函数中,this就指向的是新new 出来的那个对象。

增删改查:

遍历对象:for..in..

var obj = {
    name : 'zs',
    age : 18,
    run : function(){
      console.log('so 快');
    }
  }
for(var key in obj){
    console.log(obj[key]);
  }
//  console.log(obj.key);
//使用for ..in 遍历对象
// 循环次数: 属性的个数
//  key 相当于就是一个变量    obj 就是我们要遍历的对象

点语法和中括号语法的区别

12.栈和堆:
13.Math对象:
14.Date对象:

格式化日期:

function formatDate(d) {
  //如果date不是日期对象,返回
  if (!date instanceof Date) {
    return;
  } 
  var year = d.getFullYear(),
      month = d.getMonth() + 1,
      date = d.getDate(),
      hour = d.getHours(),
      minute = d.getMinutes(),
      second = d.getSeconds();

  month = month < 10 ? '0' + month : month;
  date = date < 10 ? '0' + date : date;
  hour = hour < 10 ? '0' + hour : hour;
  minute = minute < 10 ? '0' + minute:minute;
  second = second < 10 ? '0' + second:second;

  return year + '‐' + month + '‐' + date + ' ' + hour + ':' + minute + ':' + second;
} 

计算时间差:

function getInterval(start, end) {
  var day, hour, minute, second, interval;
  interval = end ‐ start;
  interval /= 1000;
  day = Math.round(interval / 60 /60 / 24);
  hour = Math.round(interval / 60 /60 % 24);
  minute = Math.round(interval / 60 % 60);
  second = Math.round(interval % 60);
  return {
    day: day,
    hour: hour,
    minute: minute,
    second: second
  }
} 
15.Array对象:
array.reverse();//翻转数组,返回翻转过的数组
array.sort();//默认排序顺序是根据字符串Unicode码点。

// 设置回调函数:
arr.sort(function(a,b){
  return a‐b; //负数按照正序
  //return b‐a //正数按照倒序
}) 
//concat:数组合并,不会影响原来的数组,会返回一个新数组。
var arr = [1,2,3]
var arr1 = ["a","b","c"]
var newArray = arr.concat(arr1);//[1,2,3,"a","b","c"];

//slice截取复制:复制数组的一部分到一个新数组,并返回这个新数组
//原来的数组不受影响,包含头,不包含尾
var newArray = array.slice(begin, end);
var arr = [1,2,3,4,5];
arr.slice(0,3) //[1,2,3]
//arr.slice(‐3,‐1) //[3,4]

//splice截取拼接: 以新元素来替换旧元素,以此来修改数组的内容,返回被替换的内容,原数组被改变。
//start:开始位置 deleteCount:删除的个数 items:替换的内容
array.splice(start, deleteCount, [items[,items...]);
var arr = [1,2,3,4,5]
var newArray = arr.splice(0,3,"a","b","c","d")
console.log(newArray)//[1, 2, 3]
console.log(arr)// ["a", "b", "c", "d", 4, 5] 
    var arr = [12,34,56,89,78,23,45,19];
    1.filter过滤,符合规则的元素会被存放到新数组里。    
    filter方法的数组。
    var newArr = arr.filter(function(element,index,array){
        return element > 30; //返回true表示保留该元素(通过测试),false则不保留。
    });
    console.log(arr);  //filter方法不会改变原数组里的数据[12,34,56,89,78,23,45,19];
    console.log(newArr);  //新数组里保存符合要求的元素[34, 56, 89, 78, 45]
      
    2.map方法让数组中的每个元素都调用一次提供的函数,将调用的后的结果存放到一个新数组里并返回。
    newArr = arr.map(function(element,index,array)){
    在数组里的每一个元素的最后面都添加一个字符串"0"
        return element + "0";
    });
    console.log(newArr);  //["120", "340", "560", "890", "780", "230", "450", "190"]
    console.log(arr);    //map方法不会改变原数组里的数据 [12,34,56,89,78,23,45,19]
      
    3.forEach() 方法对数组的每个元素执行一次提供的函数,且这个函数没有返回值
    var result = arr.forEach(function (element, index, array) {
        数组里的每一个元素都会被打印
    console.log("第" + index + "个元素是" + element);
    });
    console.log(result);   //函数没有返回值
      
    4.some() 只要有一个符合条件就返回true;
      
    5.every() 要求每一个都符合条件才能返回true。
16.String对象:

上面 数组 和 字符串 方法整理的比较粗略,详细参考本人整理的下面的各种数组字符串方法

→点我去看基本的数组方法
→点我去看基本的字符串方法
→点我去看ES5新增的数组方法
→点我去看ES6新增的字符串方法
→点我去看ES6数组的扩展




Knowledge changes the mind

上一篇 下一篇

猜你喜欢

热点阅读