PHP8.1.21版本已发布
vue8.1.21版本已发布
jquery8.1.21版本已发布

博客列表 > js基础与函数详解

js基础与函数详解

CC
CC 原创
2021年01月05日 19:30:41 412浏览

js基础

  • 书写习惯
    1.变量 let;常量const;
    1. // 初始化变量;值可以更新
    2. let userName = '黄飞鸿';
    3. console.log(userName);
    4. // 声明必须初始化,值不可以更新
    5. const person = 'hreo';
    6. console.log(person);
    2.定义变量区分大小写;使用小驼峰(userName);定义函数动词+名词(getName);
    3.字符串拼接使用+;值匹配==,数据类型与值匹配===
    1. console.log(100+'100');
    2. console.log(100=='100');
    3. console.log(100==='100');
  • 数据类型

1.基本数据类型:Number String Boolean undefined null

  1. const person = 'hreo';
  2. console.log(typeof person);
  3. const a =4;
  4. console.log(a, typeof a);

2.引用类型:Object Array Function

  1. // 1.数组
  2. let arr =[100,'黄飞翔',699];
  3. console.log(arr)
  4. // 判断数组类型使用isarray是数组true;
  5. console.log(Array.isArray(arr))
  6. // 2.对象
  7. let items = {
  8. id:100,
  9. name:'手机',
  10. };
  11. console.log(items);
  12. console.table(items);
  13. // 判断对象类型使用isarrayof是对象true;
  14. console.log(items instanceof Object)
  15. // 3.函数
  16. function show(){
  17. console.log(typeof show)
  18. };
  19. show()

函数详解

  • 函数提升与重写
  • 高阶函数:回调函数
  • 作用域与闭包

1.函数提升,会自动提升到顶部,在任何地方调用都是可以的

  1. console.log(getName('陈'));
  2. function getName(name){
  3. return 'welcome to '+name ;
  4. }

2.匿名函数/函数表达式可以防止函数提升

  1. // function sum(a,b) {
  2. // return a+b ;
  3. // }
  4. // console.log(sum(2,3))
  5. //上文函数转化 匿名函数,sum移动let在后面
  6. let sum = function (a,b) {
  7. return a+b ;
  8. }
  9. console.log(sum(2,3))

3.函数同名会被重写

  1. function getName(name) {
  2. return 'welcome to ' + name;
  3. }
  4. function getName(name) {
  5. return '欢迎 ' + name;
  6. }
  7. console.log(getName('陈'));

4.匿名函数定义为常量不会被重写

  1. const sum = function (a,b) {
  2. return a+b ;
  3. }
  4. console.log(sum(2,3))

5.回调函数(自己不用,给别人调用)

  1. document.addEventListener('click',function(){
  2. alert('你好');
  3. })

6.偏函数(固定值,先运算,后面的放着后面再处理)

  1. let sum = function (a, b) {
  2. return function (c, d) {
  3. return a + b + c + d
  4. }
  5. }
  6. let sum1 = sum(1, 2);
  7. console.log(sum1(3, 4))

7.柯里化(可以简化调用)

  1. let sum = function (a) {
  2. return function (b) {
  3. return function(c){
  4. return function(d){
  5. return a+b+c+d
  6. }
  7. }
  8. }
  9. }
  10. let sum1 = sum(1)(2)(3)(4);
  11. console.log(sum1)

8.纯函数,独立于上下文,返回值只能接受传入的参数影响

  1. function add(a, b) {
  2. console.log(a + b);
  3. }
  4. add(1, 2)

9.箭头函数,不能当构造函数写,与this的上下文绑定

  1. // let sum =function(a,b){
  2. // return a+b;
  3. // }
  4. // console.log(sum(1,2))
  5. sum =(a,b)=>{
  6. return a+b;
  7. }
  8. console.log(sum(1,2))

简化

  1. sum =(a,b)=>a+b;
  2. console.log(sum(1,2))

10.作用域

  1. 作用域
  2. // 1.全局作用域,作用所有区域
  3. let a = 'nihao';
  4. console.log(a);
  5. // 2.私有变量
  6. let b = function () {
  7. // 私有变量bb
  8. let bb = 'hello';
  9. // 全局变量a
  10. return a + bb;
  11. }
  12. console.log(b())
  13. // 3.块作用域
  14. {
  15. let A = 1;
  16. const B = 'h';
  17. var C = 66 ;
  18. }
  19. // 只有var可以访问,let,const支持块作用域
  20. console.log(C)

11.闭包(多重return,自我调用)

  1. function f1() {
  2. let a = 1;
  3. // a 相对于f1是私有变量,但是相对于返回的匿名函数就是一个自由变量
  4. return function () {
  5. return a++;
  6. };
  7. }
  8. let f2 = f1();
  9. console.log(f2());
  10. console.log(f2());
  11. console.log(f2());
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议