美文网首页
一些js知识点

一些js知识点

作者: 前端浅语 | 来源:发表于2020-04-26 15:46 被阅读0次
1、变量提升

提升声明,不提升赋值

2、所有的全局变量和函数都是绑定在window对象上的属性
3、命名空间是为了解决全局变量冲突的问题
4、var定义的变量,在for循环等语句块中没有局部作用域,for循环外边可以输出变量;let定义的变量,有块级作用域,只在作用域内有效;const 定义一个常量,只读;
5、解构·赋值
var person = {
    name: '小明',
    age: 20,
    gender: 'male',
    passport: 'G-12345678',
    school: 'No.4 middle school'
};
// 将passport值赋给id
let {name, passport:id} = person;
console.log(id); // 'G-12345678'
6、高阶函数
(1)arr.map(function)  // 把f(x)作用在Array的每一个元素并把结果生成一个新的Array
(2)arr.reduce(function) // reduce()把结果继续和序列的下一个元素做累积计算

练习:不要使用JavaScript内置的parseInt()函数,利用map和reduce操作实现一个string2int()函数

'use strict';
function string2int(s) {
  function str2num(str) {
     var strArr = str.split("");
     function toInt(data) {
       return +data;
     }
      return strArr.map(toInt);
  }
   var num = str2num(s);
   var res = num.reduce(function(x,y){
     return x*10+y;
   });
   return res;
}
// 测试:
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('测试失败!');
}

练习:请把用户输入的不规范的英文名字,变为首字母大写,其他小写的规范名字。输入:['adam', 'LISA', 'barT'],输出:['Adam', 'Lisa', 'Bart']。

'use strict';
function normalize(arr) {
   var result = arr.map(function(x) {
     var first = x.slice(0,1).toUpperCase();
     var lower = x.slice(1).toLowerCase();
     return first+lower;
   })
   return result;
}
// 测试:
if (normalize(['adam', 'LISA', 'barT']).toString() === ['Adam', 'Lisa', 'Bart'].toString()) {
    console.log('测试通过!');
}else {
    console.log('测试失败!');
}

(3)arr.filter(function) 回调函数作用于arr的每个元素,根据返回值是false还是true决定保留还是过滤掉。回调函数可以节后三个参数(数组的每一个元素,index, arr本身)
练习:请尝试用filter()筛选出素数

'use strict';
function get_primes(arr) {
    function isPrimeNumber(x) {
        if(x===1) {
            return false;//1不是素数,返回false
        }
        //i是2到x开平方根之间的整数
        //如果x对i取余等于0,则不是素数,返回false
        for(let i=2;i<=Math.sqrt(x,2);i++) {
            if(x%i===0) {
                return false;
            }
        }
        //如果上述条件都不满足,则是素数,返回true
        return true;
    }
    //用filter()返回新的只含有素数的数组
    return arr.filter(isPrimeNumber);
}
// 测试:
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());
} 

(4)arr.sort()方法法默认把所有元素先转换为String再排序,会直接对Array进行修改
(5)every()方法可以判断数组的所有元素是否满足测试条件。
(6)find()方法用于查找符合条件的第一个元素,如果找到了,返回这个元素,否则,返回undefined:
(7)findIndex()和find()类似,也是查找符合条件的第一个元素,不同之处在于findIndex()会返回这个元素的索引,如果没有找到,返回-1:
(8)forEach()和map()类似,它也把每个元素依次作用于传入的函数,但不会返回新的数组。forEach()常用于遍历数组,因此,传入的函数不需要返回值;

7、箭头函数

如果函数表达式只有一句可以省略{......}和return;如果多个语句不能省略;

8、面向对象编程

(1)在JS中没有class类的概念,所有的对象都是实例,继承关系就是一个对象的原型指向另一个对象。
(2)创建对象 Object.create()
(3)原型对象才有prototype(原型)属性,新创建的对象没有。

JavaScript的原型继承实现方式就是:
  • 定义新的构造函数,并在内部用call()调用希望“继承”的构造函数,并绑定this;
  • 借助中间函数F实现原型链继承,最好通过封装的inherits函数完成;
  • 继续在新的构造函数的原型上定义新方法。

相关文章

  • 前端 JavaScript基础知识梳理

    前言 javascript内容较多,知识点较杂。我整理了一些js基础的知识点(只是知识点的名称,内容不做详解),希...

  • React学习笔记(一)

    知识点及简介 知识点 简介 React JS :使用React的语法来编写一些网页的交互效果 React Nati...

  • js小知识点

    js小知识点 整理 js小知识点 (一):获取元素 1:document.getElementById('id名'...

  • Js基础知识学习-----from 米升亮

    由于这两周在开发H5推广模板,所以结合实战在学习js基础。由于js知识点比较零碎,故总结一些零碎的知识点。 主要学...

  • jQ随手笔记

    随手记录一些小知识点 1.问题:js使用slideToggle如何获取当前隐藏或者开启状态 解决方法: 2.js阻...

  • 一些js知识点

    1、变量提升 提升声明,不提升赋值 2、所有的全局变量和函数都是绑定在window对象上的属性 3、命名空间是为了...

  • 来自一位react新手的react入门须知

    前言:自己刚刚总结的关于react的知识点,比较简单,大家可以粗略看看。 一:关于react的一些知识点 1,Js...

  • js常见知识漏洞整理

    前言 本文主要摘录《js高级程序设计》,也就是我们常说的红宝书,其中一些比较少见的知识点,处理技巧。 知识点列表 ...

  • 小知识点集汇一

    小知识点集汇一 小知识点 node接口模拟返回 js接口模拟数据 mockjs mocha js 测试框架--教程...

  • 前端知识温习

    js知识点 温习js css知识点 温习css jquery温习 自己实现一个jquery vue框架温习 温习v...

网友评论

      本文标题:一些js知识点

      本文链接:https://www.haomeiwen.com/subject/tvfjwhtx.html