JS 基础部分（一）

JS初级笔记

6月11日

p7

操作ECMAscript Dom Bom

ECMAScript :这是一个规定js编程语法和基础核心知识的标准。包括网景公司的JavaScript 。微软的Jscript

Dom文档对象模型对元素操作

Bom 浏览器对象模型对浏览器操作

p8

书写位置：行内式，内嵌式，外部式

1.行内式：直接在元素内部写代码（不要写）

2.内嵌式：在head内内嵌script标签，在里面写js代码（适合较小的代码量）

3.外嵌式：引用外部js代码（建议）

p9

注释：单行注释和多行注释：

单行注释// 快捷键ctrl + /

多行注释/**/ 快捷键ctrl + shift +/

p10

js输入输出语句

1.alert(' ')

2.console.log(msg)

3.prompt('');

// 输入框

prompt('请输入你的年龄');

//输出框，弹出框

alert('输入的不对');

//控制台输出，给程序员测试用的

console.log('不知道这个些什么');

p11 变量的总体分析

p12 变量概述

变量是内存中的一个空间，对应一个数据，变量名对于合格空间

p13变量的使用

声明------->赋值

var age；//1.声明一个age的变量 varible(变量)

age = 18;

简化变量的初始化

var myname = '李欢欢';

p14-15-16变量的使用

var name = '李欢欢'

检查元素之后，可以在console看到这些变量的数据

var name = prompt('请输入你的名字');
alert('你的名字'+name);

变量的覆盖

声明多个变量

 var age=24 ,school='南京邮电大学';

1.只声明不赋值 undefined提示

2.不声明不赋值直接使用会报错

3.不声明赋值直接使用，可以，但是不建议使用，因为他会变成全局变量

p17 变量的命名规范

和其他编程语法一样的

使用驼峰命名法（首字母小写，后面每个单词开头大写），也可以使用下划线分割单词

大小写敏感，
不能数字作为开头命名，
不能使用关键字作为变量，
变量名必须要有意义
使用有道/爱词霸去翻译
不要直接使用name作为变量名，有些浏览器中name有特定含义
当字符为开头，只允许_ 和$两个

p18 测试：变量值的交换

用一个temp作为中间介质，来实现交换，很简单

p19 变量小结

没啥东西

p20 数据类型概述

p21 数据类型的简介

1.因为不同的数据占据的存储空间不同，来划分数据类型，用来提高内存利用率

变量的数据类型。

JavaScript是动态语言（弱类型），运行的适航才能知道他是什么类型，只有在运行的时候才知道

变量的数据类型是可以变的，是可以切换的

var x = 24；
x = '李欢欢';

p22-p30数据类型的分类

1.简单数据类型

Number：包括整形和浮点型，都可以，二进制，八进制（开头是0,比如010 = 8），十六进制(0x11=17)都可以表示

Number.MAX_VALUE；获得number最大值

Number.MIN_VALUE；获得number最小值

Infinity 表示无穷大

判断是否判断一个变量是否为Number类型的方法：isNaN()

NaN是not a number的缩写
Boolean ：只有true 和false
String :表示字符串

可以是单引号（推荐）（匹配规则是就近原则），也可以是双引号，都表示字符串
```
var str = '我是一个"高富帅"';
规则：外双内丹，外单内双
```
Undefined

只声明未赋值
Null

里面存值为空

2.转义字符（重点记忆这些）

\n 换行
\t tab 缩进
\\ 斜杠\
\'
\"
\b 空格

3.用js做出简单的字符串长度判断规则

str.length ：可以得到字符串的长度

4.字符串的拼接（数值详解，字符相连）

console.log('字符串1'+'字符串2');

console.log(数字+'字符串2'); //拼接

console.log(数字+数字);//数字的和

5.字符串加强（变量不写在字符串用，而是通过+连接起来）

console.log('字符串1'+数字+'字符串2'); //拼接

6.获取数据类型(prompt取的值是字符类型的)

var num = 10;

console.log(typeof num)；判断它是什么类型

p31 字面量（源代码中一个固定值的表示法）

p32 数据类型转换

转换为字符串类型
- 数字型转换成字符串方法一： var str = num.toString();
- 方法二：String(num)；
- 方法三：(隐式转换)利用拼接的方法来转换，加上一个空的字符串 num1 = num + ''
转换为数据类型
转换为布尔类型

p33 把其他的类型转化为数字类型

var age = prompt('请输入你的年龄');

方法一：parseInt(age); 只能得到整数
- parseInt('120px') 可以直接转化成数字
方法二：parseFloat(变量) 可以得到整数和浮点数

p34 转换为数字类型和隐式转换

方法一：利用Number()方法
方法二：利用四则运算（除了+法都可以）
- var result = ’123'-'120';得到一个整数

p35-36 简单的转换用例

		var year = prompt('请输入你的出生年份');
        age = 2020 -year;
        alert(typeof age);
        alert(age);
//获取出生字符串转换为数字的案例1
		var str1 = prompt('请输入数字');
        var str2 = prompt('请输入数字2');
        var num = Number(str1)+Number(str2);
        var num1 = parseFloat(str1)+parseFloat(str2);
        alert(typeof num);
        alert(num);
//字符串相加转化为数字的案例2

p37 转换为布尔值

方法一：使用Boolean()函数，将其他类型转换为布尔值

1.代表空,否定的值会被转换为false，0 ，NaN,null ，undefined等

p38 编译语言和解释语言的特点和区别

概念：

1.编译语言：（全部上完菜才能吃）代码执行之前将代码编译

2.解释语言：（边上菜边吃）

p39 标识符，关键字，保留字

标识符不能是关键字和保留字

关键字：js本身已经使用的字，不能用他们充当变量名

保留字：实际上就是预留的“关键字” (java中的那些关键字)

p40 作业

p41-p54 运算符导读（各种语言的运算没什么区别，我跳了）

运算符:实现赋值，比较，执行数值运算功能的符号

算数运算符
1. 加减乘除
2. 取余（判断一个数能否被整除）
3. 浮点数由于精度有问题，不能拿着浮点数来直接进行计算
返回值和表达式
++i（先自加，再返回）和i++（先输出i的值，然后才返回）
逻辑运算符与或非（逻辑&& || not）
中断逻辑与或（& |）

p55-P72 流程控制分支结构（和其他语言差不多）

顺序结构
分支结构
- if else
- if (){
- }else if {
- switch(表达式){
  
  case value1:
  
  执行语句1
  
  break;
  
  case value2:
  
  执行语句2；
  
  break;
  
  defalut:
  
  }
  
  注意事项：1.表达式经常写成变量
  
  2.表达式和value的值相匹配是全等于符号，也就是说他们的数据类型也要一直
循环结环
- for循环（最重要）
  - for(var i = 0;i < 100;i ++){
    
    console.log('你好吗？');}
- while 循环
  - while(条件)
- do while循环 至少执行一次代码
  - do
    
    while(条件){执行
    
    }

p73断点调试

F12 到检查页面
点击source 进入调试，再代码左边设置断点
刷新网页，点击step into next function call
再debugger paused 旁边有一个watch 可以添加变量，可以随时看到变量的变化

p92-93 break 和continue

continue关键字跳出单次的循环当i ==3的时候不执行，否则都执行
break 跳出全部的循环

p94-95 标识符命名规范（6月11日笔记）

变量，函数的命名必须要有意义
变量的名称一般用名词
函数的名称一般用动词
for 括号的左右空间都应该有个空格

p96 数组

1.数组的创建方式

var arr = new Array();//创建一个空的数组

2.利用数组字面量创建数组(数组里面的数据用，隔开)

var arr =[];

var arr = [1,2,3,4];

数组可以存放任意类型的数据

p97 获取数组元素

数组的索引（下标，从0开始）

arr[2]可以得到第三个数据。

没有这个数组元素的时候，输出undefined。比如一共只有三个元素，现在输出第四个的时候

p99 把数组中的全部元素取出来

通过循环取出所有元素，也叫做遍历。

for (var i = 0 ;i ❤️ ;i++) {

console.log(arr[i]);}

p100 数组长度

数组名.length 可以动态监测数组长度 。例如： arr.length

数组的长度=最大索引号+1,他们不等价

p101-102 案例 for循环求和，平均值，最大值

p103 将数组元素相加

str= ‘ ’；

str+=arr[i];

p104 新增数组元素

修改length长度，实现扩容

<script>
        var arr = ['red','blue'];
        console.log(arr.length);
        arr.length  = 5;//把数组元素修改成5，后面会多出亮哥哥empty元素
        console.log(arr.length);
        console.log(arr[3]);//undefined
    </script>

修改索引号，新增数组元素（最常见的）

不要直接给数组赋值，否则会覆盖以前的数据

console.log(arr);之一直接输出数组

p105-107 筛选数组

<script>
        var arr = [2,0,6,1,77,0,52,0,25,7];
        var arr1 = [];   
        var j = 0;     
        for(var i = 0;i<arr.length;i++){            
            if(arr[i]>10){
                arr1[j] = arr[i];
                j++;
            }           
        }
        console.log(arr1);
    </script>

<script>
        var arr = [2,0,6,1,77,0,52,0,25,7];
        var arr1 = [];    
        for(var i = 0;i<arr.length;i++){
                if(arr[i]>10){
                arr1[arr1.length] = arr[i];
            }       
        }
        console.log(arr1);
    </script>

由于新数组的长度从0开始，所以可以利用这个性质给该数组的下个元素赋值。

p108-109 数组去重翻转数组（无语，旧数组的值从后往前赋值给新数组）

需要一个新数组，把原数组中的数据存放到新数组

p110-112 冒泡排序

<script>
        var arr = [2,0,6,1,77,0,52,0,25,7];         
        for(var i = 0;i<arr.length - 1;i++){
            for(var j=0 ;j<arr.length-i-1;j++){
                if(arr[j]>arr[j+1]){
                    var temp;
                    temp =arr[j];
                    arr[j]=arr[j+1];
                    arr[j+1]=temp;
                }
            }      
        }
        console.log(arr);
    </script>

posted @ 2020-06-15 10:58 li33的博客阅读(227) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

li33的博客