首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >js基础知识

js基础知识

作者头像
星辉
发布2019-01-15 10:33:33
5200
发布2019-01-15 10:33:33
举报

js基础知识练习

目录

  • 函数声明和函数表达式
  • 声明前置
  • arguments
  • 函数的”重载”
  • 作用域问题
  • 匿名函数
  • 闭包
  • 代码实例
    • 函数参数和arguments
    • 返回参数的平方和
    • 函数内重写对象

函数声明和函数表达式

函数声明
function functionName(parameters) {
  // body
}

函数声明后不会立即执行,会在我们需要的时候调用到。

函数表达式
var x = function (parameters) {
  // body
};

js 函数可以通过一个表达式定义. 函数表达式可以存储在变量中

函数表达式与函数声明的区别

最主要区别是函数名称 在函数表达式中可省略函数声明,从而创建匿名函数

声明前置

变量的声明前置
console.log(a)
var a = 1
输出结果
undefined
代码分析
  • 由上到下执行代码之前,解析器会先找关键字var,找到了var a,就提升var a并将a初始化为undefined
  • 再由上往下执行,读到consolo.log(a),控制台打印出来的就是undefined
  • 接着给变量a赋值为1,如果这个时候后面再加一句consolo.log(a),那么控制台就会多打印出一个1
函数的声明前置
func()
function func() {
    console.log("hello world")
}
输出结果
hello world
代码分析
  • 找到所有用function声明的变量,在环境中创建这些变量
  • 将这些变量初始化并赋值为function(){console.log(“hello world”)}
  • 开始执行代码a()

arguments

arguments是什么

一个对应于传递给函数的参数的类数组对象。

arguments知识点
  • arguments对象是所有(非箭头)函数中都可用的局部变量.
  • 可以使用arguments对象在函数中引用函数的参数, 引用方式和数组相同.
  • 可以使用Array.from()方法或扩展运算符将参数转换为真实数组.

函数的”重载”

重载

一个函数通过不同参数列表来实现各个功能,叫函数重载

js中的”重载”

js中不存在函数重载的概念

var override = function () {
    switch (arguments.length) {
        case 0 :
            console.log("0");break;
        case 1 :
            console.log("1");break;
        case 2 :
            console.log("2");break; 
    }
};
override("hv", "ge")
override("xyhv")
override()
输出结果
2
1
0
代码分析

这是js实现重载的传统方法之一

作用域问题

全局作用域

在代码中任何地方都能访问到的对象拥有全局作用域

拥有全局作用域的情形
  • 最外层函数和在最外层函数外面定义的变量拥有全局作用域
  • 所有未定义直接赋值的变量自动声明为拥有全局作用域
function doSomething(){
    var authorName="星辉"
    blogName="星辉的博客"
}
// blogName拥有全局作用域,而authorName在函数外部无法访问到
  • 所有window对象的属性拥有全局作用域
局部作用域

局部作用域一般只在固定的代码片段内可访问到

拥有局部作用域的情形
  • 函数内部
js没有块级作用域

例如if条件语句, 就不算一个独立的作用域

变通方式

通过自执行函数创建临时作用域

function foo() {
    var x = 1;
    if (x) {
        (function () {
            var x = 2;
            // some other code
        }());
    }
    console.log(x)
}

foo()
输出结果
1

匿名函数

定义

没有函数名的函数

匿名函数的创建
  • 第一种方式
var mi = function(x) { return 2* x; }

“=”右边的函数就是一个匿名函数,创造完毕函数后,又将该函数赋给了变量mi

  • 第二种方式
(function(x, y){
    alert(x + y);  
})(2, 3);

在第一个括号内创建了一个匿名函数,第二个括号用于调用该匿名函数,并传入参数

闭包

定义

函数的嵌套,内层的函数可以使用外层函数的所有变量,即使外层函数已经执行完毕

作用

保证内部作用域中的引用不会被垃圾回收器回收

闭包的方式构建类
var object=function(mod){
      var field1;
      var method1=function(){

      };
      return{
             field1:field1,
             method1:method1
      }
}(model);
代码解析
  • 这样可以很好的保护私有成员变量和方法
  • 可以通过以上方式注入实参

代码实例

函数参数和arguments
function getInfo(name, age, sex) {
    console.log('name', name)
    console.log('age', age)
    console.log('sex', sex)
    console.log(arguments)
    arguments[0] = 'valley'
    console.log('name', name)
}
getInfo('小辉', 18, '男')
getInfo('辉辉', 16)
getInfo('男')
输出结果
name 小辉
age 18
sex 男
Arguments(3) ["小辉", 18, "男"]
name valley
name 辉辉
age 16
sex undefined
Arguments(2) ["辉辉", 16]
name valley
name 男
age undefined
sex undefined
Arguments ["男"]
name valley
代码分析
  • Js是弱数据类型, 实参少了则按顺序给形参赋值
  • arguments 即获取了所有的实参, 可按数组的方式调用
  • 可更改arguments,从而更改相应的值
返回参数的平方和
function sumOfSquares(){
    var sum = 0
    var arr = [...arguments]
    for (var i = 0; i < arr.length; i++) {
        sum += arr[i] * arr[i]
    }
    return sum
}
var result = sumOfSquares(2, 3, 4)
var result2 = sumOfSquares(1, 3)
console.log(result)
console.log(result2)
输出结果
29
10
代码分析
  • 不要在形参中写arguments,否则js会把其当作形参变量
  • arguments是类数组对象,转为数组除了需要拓展运算符,还有数组的中括号
函数内重写对象
function setName(obj) {
    obj.name = 'Nicholas'
    obj = new Object()
    obj.name = 'Greg'
}

var person = new Object()
setName(person)
console.log(person.name)
输出结果
Nicholas
代码分析

在函数内部重写 obj 时, 这个变量引用的是一个局部对象 这个局部对象会在函数执行完毕后立即被销毁

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2018年09月08日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • js基础知识练习
    • 目录
      • 函数声明和函数表达式
        • 声明前置
          • arguments
            • 函数的”重载”
              • 作用域问题
                • 匿名函数
                  • 闭包
                    • 代码实例
                    相关产品与服务
                    腾讯云代码分析
                    腾讯云代码分析(内部代号CodeDog)是集众多代码分析工具的云原生、分布式、高性能的代码综合分析跟踪管理平台,其主要功能是持续跟踪分析代码,观测项目代码质量,支撑团队传承代码文化。
                    领券
                    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档