js基础

js基础

函数

重点掌握

​ 如何声明,如何调用,如何写函数

声明

1 关键字

function 函数名(参数){函数体}

​ 2 函数表达式

var 变量名 = function(参数){函数体}

调用

函数名(实际参数)

写函数的步骤

  • 先写过程
  • 分析过程中,哪些可以作为函数体(在过程中,总是不变的),哪些可以作为参数(在过程中,不断改变的)
  • 按照语法写函数的格式
  • 有没有返回值
  • 调用

函数的返回值

三种情况

  • 没有return --> undefined
  • 有return,没有跟数据--->undefined
  • 有return,并且有跟着数据-->跟着的数据

return作用

  • 修改函数的返回值
  • 终止函数的执行

函数的参数

​ 形参,实参

​ 形参的值发生变化,不影响实参的值

可以有省略参数的机制

一般实现由2种方式:

  • arguments对象

  • 参数默认值

函数的执行过程

  • 函数里面的代码,如果没有调用时不会执行的
  • 函数里面可以调用另外的函数
  • 函数在调用的时候,会回到声明的位置执行,执行完毕之后,又会回到调用位置,继续执行
  • 函数在执行的时候,会发生参数的传递,按照顺序传递

匿名函数

没有名字的函数------匿名函数无法单独存在

不定个数的参数的处理方式

  • 在js中,实参个数可以和形参个数不一致
  • 在函数中,因为形参和实参个数可以不一致,准备了一个东西,( arguments对象)可以得到所有的实参
    • arguments对象里面可以得到所有的实参
    • arguments对象可以通过下标得到实参,但是注意一个问题: arguments不是数组
    • arguments无法再函数外面使用
    function getSum(a,b){
        var sum = 0;
        for(var i=0;i<arguments.length;i++){
            sum += arguments[i]
        }
        return sum
    }
    console.log(getSum(10,20));
    console.log(getSum(10,20,30));

特别注意

#### 什么东西可以作为变量的值 - 数据
  • 数据都是有类型的
  • 函数可以作为变量的值 --> 函数也是一种数据
  • 通过typeof 函数名 ==》 函数也是一种数据类型

什么东西可以作为函数的参数

  • 只要是归数据类型管的都可以作为参数
  • 函数也可以作为参数
  • 在一个函数a中,以参数形式传入的另一个函数b,作为参数的函数b,是可以在函数a中被调用的
  • 在一个函数中,以参数形式进入到该函数的另一个参数,在执行的时候,称之为:回调函数

什么可以作为返回值

数据都可以,函数也是数据的一种,函数也可以作为返回值

逻辑运算符的短路运算规则

逻辑或(||)

  • 如果左边的隐式转换结果是true,整个式子的结果就是左边的表达式的结果
  • 如果左边的隐式转换的结果是false,直接返回右边

逻辑与(&&)

  • 如果左边为true,返回右边

  • 如果左边为false,直接返回左边

给每个参数设置一个默认值,如果没有传递进来,就使用默认值参与运算

a = a || 0;

​一般在调用以参数传入的函数的时候,需要先判断这个东西是不是函数

f && f();

匿名函数

使用场景:

  • 函数表达式

    var fn = function(){}

  • 可以作为参数

  • 自调用函数

    • 自动调用 - 声明完毕之后,立刻调用
    • 自己调用 - 自己调用自己(递归)

自调用函数

​ 语法:(function(形参){})(实参);

​ 作用:自调用函数的作用就是形成一个封闭的作用域,把里面的变量保护起来

预解析和作用域

看看函数两种声明方式的区别

​ 函数表达式必须在完成声明之后,才可以调用

预解析

js在执行之前,会先预解析

​ 预解析会把当前作用域下的变量声明和函数的声明提升到当前作用域的最顶端,但是变量的赋值,函数的调用都还在原来的位置,还是原来的顺序

​ 简单说:

​ 在执行之前: 把 变量和函数 的声明 提升到 {当前} 作用域 的最顶端

作用域

​ 作用的范围,有效的范围

​ 指的是变量和函数的有效范围

作用域链

​ 多层作用域关系--作用域链

​ 变量或者函数的访问规则

  • 如果内部作用域有自己的变量,会优先使用自己的
  • 如果自己内部没有,会跨过当前作用域,往上级作用域查找
  • 如果上级也没有,就往上级的上级,以此类推,直到全局作用域
  • 如果全局作用域也没有,报错

内置对象

​ 获取当前的系统日期和时间

内置日期对象的多个方法

  • 获取年份 getFullYear()
  • 获取月份 getMonth() 但是要注意,返回的结果是0表示一月,1表示二月
  • 获取日份 getDate() 得到一个月中的某一天
  • 获取小时 getHours() 得到小时
  • 获取分钟 getMinutes() 得到分钟
  • 获取秒 getSeconds() 得到秒
  • 获取当前的毫秒 getMilliseconds()
  • 获取时间戳:getTime() 从1970年1月1日到现在的所经过的毫秒数

Math对象

// 随机取值函数
// floor向下取整,ceil向上整
function getRandom(n,m){
        return Math.floor(Math.random() * (m-n + 1) + n);
    }

数组对象

数组的方法

  • reverse() 可以将数组翻转
  • splice() 删除数组的元素
    • 数组对象.splice(从哪里开始删除,一共要删除多少个);
  • push() 从数组的末尾添加一个或者多个元素
  • pop() 从数组的末尾删除一个元素,并返回该元素
  • unshift() 从前面添加一个或者多个元素
  • shift() 从前面删除一个元素,并返回
  • sort() 排序
    • 数组.sort();
    • 有默认的排序规则
    • 有默认的排序规则
      • 需要传递一个排序规则函数
      • 该函数要有两个参数
      • 返回值是两个参数的差
arr.sort(function(a,b){
        return a - b;
    });

注意

  • 一般不会出现函数名和变量名重名的情况 -- 除非是面试题
  • 如果能做到变量名有意义和函数名有意义,就不会出现重名

小细节

  • 预解析,会优先解析函数,再解析变量
  • 变量声明比函数声明更优先
  • 如果函数名和变量名重名,就会覆盖

字符串

根据索引获取对应的字符

  • 字符串[索引]

  • 字符串.charAt(索引)

  • 把多个字符串连接起来------ 使用+运算符

  • 截取字符串中的某些字符--- 字符串.slice(从哪里开始,到哪里结束) , 不包括结尾,如果没有指定末尾,会包含从开始到末尾的所有的字符

  • 根据字符查找对应的索引---- 字符串.indexOf(字符) 如果找得到就得到对应的数字,如果找不到,就得到-1

  • 替换字符串中的想要替换的字符,但是不会修改原来的字符

    字符串.replace(旧的字符,永远替换的新字符)

  • 分割字符串为数组----- 字符串.split("切割符");

    var str = "a|b|c|d";
     var arr = str.split("|");
     console.log(arr);
    
  • 将数组连接成字符串

    数组.join("连接符")

        var str = "a|b|c|d";
    //    var arr = str.split("切割符");
        var arr = str.split("|");
        console.log(arr);
    //    var s = arr.join("|");
    //    console.log(s);
    

对象

面向对象思想

把编程中遇到的所有的功能,都认为是某个对象的方法

  • 先获取对象(自己创建或者原来就有的)
  • 指挥对象做事情------使用对象的属性或者方法

面向对象思想的三大特征: 封装性 , 继承性 , 多态性

什么叫对象

​ 从编程的角度讲: 对象就是属性和方法的集合

​ 属性和方法的表示方式: 键值对

在编程中,就把事物的特征叫做对象的属性,把事物的行为叫做方法

内置对象

date math array string -- js原本就给我们封装好的一堆的代码的高度封装

自定义对象

  • 创建对象

    • new Object() 构造函数法
    • {} 字面量法
  • 给对象设置属性或者调用对象的属性

    • 不同的对象具有不用的能力,当我们想要使用方法的时候,必须找对对象
    • 定义的对象如果想要他会做某些事情,或者具备某些特征,就要给他添加属性和方法
    • 语法:
      • 对象.属性 = 值;
      • 对象.方法 = function(){实现功能的过程}
  • 使用对象的属性和方法

    • 对象.属性
    • 对象.方法(参数)
  • 字面量表示法的快速声明对象的键值对的方式

    {

    ​ 属性:值,

    ​ 属性:值,

    ​ 方法名:function(){}

    }

  • 工厂模式

    function createComputer(color,brand,price,weight){
            var computer = new Object();
            computer.color = color;
            computer.brand = brand;
            computer.price = price;
            computer.weight = weight;
            computer.open = function(){
                console.log('等灯等灯');
            }
            computer.close = function(){
                console.log('叮咚');
            }
            return computer;
        }
    
        var c1 = createComputer('red','apple','¥19998','3kg');
        var c2 = createComputer('black','联想','¥9998','6kg');
        console.log(c1);
        console.log(c2);
    

将工厂模式变成自定义构造函数

​ 1、改名字 把动词+名词结构 ---> 名词结构,首字母大写

​ 2、把new Object去掉 还有return 去掉

​ 3、把之前代表对象的变量,改成this

// 更加建议使用自定义构造函数 -- 简洁,更加符合编程人员的审美
    function Computer(color,brand,price,weight){
        this.color = color;
        this.brand = brand;
        this.price = price;
        this.weight = weight;
        this.open = function(){
            console.log('等灯等灯');
        }
        this.close = function(){
            console.log('叮咚');
        }
    }

    // 在使用自定义构造函数创建对象的时候,记得一定要new
    var c1 = new Computer('red','apple','¥19998','3kg');
    console.log(c1);
    c1.close()

new的秘密

  • 原生构造函数(Array,Date,Object)

  • 自定义构造函数(Computer)

  • 都有一个关键字new

new做的工作

  • 创建一个对象,把对象赋值给this
  • 执行构造函数的代码
  • 把对象返回调用构造函数的位置
  • 当构造函数创建对象,都需要new

this(重点)

  • this在构造函数中指向实例对象

  • 普通函数中this指向window

  • 作为对象的方法-----this指向调用该函数的对象

    作为函数内部的this,谁调用该函数,this就是谁

注意

​ 普通函数的角色

​ 所有window的属性和方法在使用的时候,都可以把window省略

对象

属性和方法

  • console.log();//直接在控制台中打印输出

  • 遍历对象

    把每个键值对都拿出来

    ​ for(var 键名 in 要遍历的对象){

    ​ }

    一般:

    ​ for(var key in obj){

    ​ }

  • 访问属性的第二种方式

    ​ 访问属性:

    ​ 对象.属性 ----》 点操作符

    ​ 对象[属性名的字符串]----》 键的方式访问

删除/添加对象的属性

​ 添加属性:

​ 对象.属性 = 值;

​ 删除:

​ delete 只能用于删除的对象的属性

​ delete 对象.属性

值类型和引用类的区别

简单类型(值类型)
复杂类型(引用类型)
    值类型和引用类型的异同:
        1 值类型存储在栈空间
            引用类型存储在堆空间,堆空间的地址会存储在栈空间上
        2 当我们以一个变量作为另一个变量的值的时候,其实是把栈空间中的值复制一份
        3 当我们堆形参进行修改的时候
            如果实参是值类型,形参和实参就互不影响
            如果实参是引用类型,形参会影响实参       

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,919评论 6 502
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,567评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,316评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,294评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,318评论 6 390
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,245评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,120评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,964评论 0 275
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,376评论 1 313
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,592评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,764评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,460评论 5 344
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,070评论 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,697评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,846评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,819评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,665评论 2 354

推荐阅读更多精彩内容

  • 一、 入门 1、 JS代码书写的位置 写在行内 写在script标签中 写在外部js文件中,在页面引入 注意点: ...
    宠辱不惊丶岁月静好阅读 852评论 0 0
  • 长大之后,我觉得当初那些值得让自己骄傲的事情,现在看来一点用都没有。我突然意识到人最怕的就是什么都想会,什么都只会...
    口述笔录阅读 746评论 0 0
  • 脉脉的活动页面,字述输入一个字的时候,iOS系统自带九宫格不能输入“转”
    睡哥阅读 77评论 0 0
  • 朱纱绫丝,丝不琦;白珑玲玉,玉难絮 …………………………………………………… (上面还有内容) 怀里的爱人米米,已...
    伊洛斯阅读 204评论 0 0
  • 相隔9354公里,我好想你。 上天如此眷顾我,让你来到我的身边,第一眼看到你,我就深深的爱上你,你...
    依然OK阅读 707评论 1 0