02-javascript基础学习笔记

1.循环语句###

1.1 while循环
While 循环会在指定条件为真时循环执行代码块。

while (条件)
  {
  需要执行的代码
  }

1.2 do/while循环
do/while 循环是 while 循环的变体。该循环会执行一次代码块,在检查条件是否为真之前,然后如果条件为真的话,就会重复这个循环。

语法:
do
  {
  需要执行的代码
  }
while (条件);

1.3 for循环

  • 语句1:最先执行,而且永远只执行一次
  • 语句2:执行完语句1,就执行语句2,当语句2条件为true时,执行循环体中的代码,执行完循环体中的代码后执行语句3,当语句3执行完后那么会再次执行语句2,直到语句2的条件判断为false时,循环退出
语法:
for(语句1;语句2;语句3){
    //需要执行的代码
}

2.break与continue###

2.1 只出现在循环体中,都是用于结束循环,单独写会报错
2.2 break:直接结束整个循环
2.3 continue:用于跳过循环中的一个迭代,例如输出不能被3整除的数

for(var i = 1;i<=100;i++){
        if(i%3==0)
        continue;
        console.log(i);
    }

3.实际开发中不管什么项目,都是分块开发,每个板块再整理出各种需求,多加注释###

4.函数###

4.1定义:具有特定功能的代码块
4.2 两种定义方式:

方法一:
function 函数名(){
    函数体
}
方法二:
var demo = function(){
    函数体
}

4.3 注意点:函数定义完以后函数名会被放到内存中,解析器不会看代码块的内容,函数想要被执行,必须手动调用,解析器才会返回去看代码块中内容,调用方法:函数名称();其中()表示立即执行
4.4 函数的几种方式

  • 4.4.1 无参无返回值
  • 4.4.2 有参无返回值
    参数写在()中,参数也是标识符,他就是一个变量,参数在函数调用时赋值
例如:
function printRose(num){
    //代码块
}
  • 4.4.3 无参有返回值
    返回值:当函数执行完毕的时候,如果想得到一个结果,那么用return返回,用return返回的值就是函数的返回值。
如:
function test(){
    return 123;
}
var result=test();
console.log(result);
  • 4.4.4 有参有返回值
    有参数,也有返回值的函数
如:
function average(num1,num2,num3,count){
    return (num1+num2+num3)/count;
}
console.log(average(13,14,15,3));

4.5 在开发中直接出现数字称为魔鬼数字,如某个算数中出现固定除以3而非变量,开发中无返回值函数比有返回值函数用的多。因为函数注重的是过程而不是结果,有返回值的函数大多是工具类中使用

4.5 递归函数:自己搞自己
一次又一次的调用自己并开辟新的空间,结束时也是从内向外一层一层释放空间,函数内有return将会结束该函数,作为了解,实际开发中不常用。

5.变量的作用域###

5.1 局部变量(内部变量)

  • 定义:声明在函数内部的变量或者函数的参数
  • 作用域:只有在函数内部能使用
  • 生命周期:从定义的那一行开始,当函数执行完毕的时候死去

5.2 全局变量

  • 定义:声明在函数外部的变量
  • 作用域:可以在整个JS文件中使用
  • 生命周期:只有当当前的网页关闭才能释放

5.3 注意:开发中,全局变量和局部变量相比,局部变量用的更多。因为全局变量相对局部变量来说,更加耗内存。所以实际开发中应尽量避免全局变量的使用

5.4 在函数内部如果把值赋给未声明的变量,则该变量将会被作为全局变量来使用。开发中不建议使用,仅作为了解(没有var声明的变量会提升为全局变量)

5.5 变量的提升

  • 在函数内部如果提前使用了和外部相同名称的变量,那么就会发生变量提升。相当于把变量的声明提升到函数的顶端,但并不赋值,实际开发不建议使用,仅作为了解,只是用来对付面试。

6.JavaScript初体验###

js动态控制网页样式与结构

6.1 什么是dom

  • 比喻成一颗长满标签的树

6.2 什么是对象

  • 具有很多功能的功能组
  • 在文档中引申为document
  • 如果一个对象想要调用其方法,通过"."进行document.getElementById("ID名称");在js中,所有CSS样式中划线"-"都改为驼峰命名法

6.3 js控制结构:改变对象中的内容结构

如:
var dom = document.getElementById("box");
console.log(dom);
dom.innerHTML="<a href=#>这里是一个超链接</a>"

7.事件三要素###

7.1 事件源(发起者)

7.2 事件(动词)

  • onclick:点击事件
  • ondbclick:鼠标双击
  • onchange:文本内容或下拉菜单中的选项发生变化
  • onfocus:获得焦点
  • onblur:失去焦点
  • onmouseover:鼠标悬停
  • onmouseout:鼠标离开
  • onload:网页文档加载
  • onunload:关闭网页

7.3 事件处理程序(函数)

事件源.事件=事件处理程序

8.封装代码###

抽取原则:代码高度相似、功能相同的代码抽取出来,变量作为参数

  • 第一步:自定义一个函数
  • 第二步:把不同的变量作为参数
  • 第三步:将代码进行整合

9.入口函数###

当整个文档加载完毕才执行,在head中写script代码时使用

window.onload=function(){
    //script代码
}

10.数组###

10.1 数组是一个对象,用来存储其他变量的集合

10.2 数组的声明

        var arr = new Array(); //几乎没人用
        var arr = [];

10.3 给数组添加元素

定义的同时添加元素
var arr = [1,"123","hello"];

利用数组对象的push方法添加元素,永远添加在末尾
arr.push(元素);

先定义再逐个添加
var arr=[];
arr[0]=1;
arr[1]="true";
arr[2]=false;
arr[3]=undefined;

10.4 数组的常用方法,请参考W3C

arr.length; //返回求数组长度
增
var arr=[12,undefined,null,"str"];
arr.push(添加的值1,添加的值2,...);
arr[5]=188;
删
var result = arr.pop(); //删最后一个并返回
console.log(result);  //"str"
改
arr[1]=1;
查
arr[3];

10.5 数组的取值

根据脚标来取值
var result = arr[1];
result //"true";

10.6 数组的遍历:就是取出数组中的每一个元素

var arr=[12,"123",undefined,false,88];

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

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,204评论 0 4
  • 孔山又名窟窿山。在保定易县的崇山峻岭中,孔山不算高,却是千古名山。自北魏郦道元将其记载到《水经注》后,1500年以...
    八道I江山阅读 2,170评论 0 0
  • 现在坚持尽量每天画图!
    图图南阅读 298评论 0 2
  • cron是Linux中默认的计划任务。使用cron,你可以安排一个计划(比如:命令或者shell脚本)周期性地运行...
    Jun_Sleepy阅读 1,762评论 0 2
  • ①孔明灯 谁笑红尘如纸薄,长风吹起前襟。时于灼眼抿唇深。并肩凉子夜,明月照衣衿。 抛却前尘如放手,星灯如烙如喑。天...
    江适意阅读 501评论 7 7