JavaScript基础01—基本概念

js基础

js书写位置

内部

写在html中直接书写

  1、HTML自上向下 同步解释性文档

  2、上面的代码无法调用下面的标签或者script，下面的代码可以调用上面的标签或者script

  3、ES6严格化后，第二条中有些不完全适用

  4、有写在html外面的情况（不建议），利用了浏览器自动修复

标签内

• 通过事件触发

	<button onclick="clickHandler()">按钮</button>

• 特例代码
  不跳转

    <a href="javascript:void(0)">超链接</a>

• 注：单双引号嵌套使用，不要使用同一种

外部引入

1、可以写在head和body部分

2、载入

	 <script src=""></script>

- src 地址尽量都用./开始，禁止使用绝对路径

  ./ 当前文件所在文件夹

  ../上一级目录

  注：地址尽量都用./开始，禁止使用绝对路径

3、 变量污染：如果加载的js中，变量或者函数相同时，就会覆盖

4、async defer ……

5、ES6的代码引入和写法……

注释

单行注释

• ctrl+/
• 注释一行的代码

块/多行注释

• shift+alt+a

• 用途

  • 注释一行中的部分内容
  • 注释掉一个函数和大量代码块
  • 函数的注释说明（函数部分讲）

作用

• 排错
• 让不用的代码不执行
• 解释代码

调试

• 浏览器调试ctrl+shift+i

console

console.log
console.dir
console.error  错误信息
console.info   信息

sources

打断点
计算数据

network

ALL  所有网络请求
XHR   Ajax
WS   长连接
Manifest  应用缓存

performance

录屏

mamory

快照

application

常用方法

书写规范

• 每行结束，半角分号

• 大小写严格

• 一般首字母小写，除了类，一般都使用驼峰式命名

  驼峰式，除了第一个外，每个单词首字母大写，其他字母小写

  例：setWorkDay

alert() 弹出内容框

放置鼠标显示提示：

alert(message?:any):void

message 参数名称 ?可以不写值 :any 这个参数的类型可以是任意的， :void 不返回任何值

• 方法一般包括 方法名(参数…).都必须是英文半角

confirm() 确认消息框

• 返回布尔值 是——true 否——false

prompt() 提示消息框----就是专门用来给用户提供输入窗口的

• 可以有默认值，返回字符串

document.write()

• js 是点语法，表示某个对象的方法和属性

document.body.innerHTML=

• 赋值写法，对象的属性需要赋值

对象有两种模式，一种属性，一种方法，属性使用等号赋值，方法使用括号执行

write和innerHTML

• write仅属于document的方法，可以给整个文档中增加内容
• innerHTML是所有body内（含body）标签的属性，可以给这些标签内局部增加内容和标签

变量

ECMAscript标准

• 浏览器都需要按照该标准渲染页面

ES5前

• 弱类型，不需要定义，随手写，不需要类型
• 等号左侧变量名称，右侧值
• 连等，先赋值给等号最左边的元素，再逐级向右
• 等号赋值有返回值 例：a=3返回值3
• 代码遵从从左至右的执行方式

ES5

• ES5 IE8时代支持的js标准

• 不允许直接使用变量的赋值

• var 定义变量

  • 变量命名规则

    • 1、变量必须驼峰式命名法
    • 2、临时变量必须使用_起头，后面接驼峰式命名，有时候会在函数的参数中使用临时命名
    • 3、变量不可以使用关键词和保留字
    • 4、全局的变量名不能与window下的属性和方法同名

• 不使用var ，那变量是window的属性

• 在函数以外的地方使用var声明 也是设置了window的属性

• 使用var 不返回值，例：console.log(var a = 1);无返回值

ES6

• 2015年正式使用ES6 又称为ES2015

• let 变量 定义后可以变化值

• const 常量 定义后不能被改变

  • 常量定义时，名称全部大写，并且使用下划线_区分单词
  • 使用常量目的是，不会被别人修改或者变量污染改变
  • 不改变对象的引用地址（有消耗性能）

常用变量定义方式

• var a,b,c;
• var a1=3,b1=4,c1=”a”,d1=true;
• 尽量不适用连等赋值

数据类型

Typeof判断数据类型，两种表示方法都可

console.log(typeof a);

ypeof a);

console.log(typeof(a));

字符类型

• string
• 所有使用 ‘’ “” ``都是字符型
• 单双引号套用，也是字符型
• console打印颜色为黑色

数值类型

• number

• 所有数字

  • 小数叫做浮点数

• 表示方式，十进制，十六进制，八进制，科学计数法

• 定义的和打印结果不一定完全相同（八进制，十六进制，科学计数法会转为十进制）

布尔类型

• boolean
• 是否，对错，任何事情的两面
• true,false

未定义型

• undefined
• 两种情况，一种仅定义变量未设置值，一种定义变量并且设定值为undefined
• 两种值相等，但是实际是不同形态
• 第一种用于全局定义，根据需要使用赋值，初始是没有值的
• 第二种用于初始值必须是undefined，或者将原有有值的变量修改为undefined

空值

• null
• 将所有引用地址标记清空，用于清理内存（垃圾回收）
• 字符类型，数值，布尔，未定义都不需要null清除

对象型

• object

• var obj={} 空对象

• obj=null;设值为空

• key:value 键值对

  • 关键词和值唯一匹配

  • 对象中不能出现重复的key

  • key不需要加””

  • 描述对象时，最好不加双引号

  • 变量作为key，需要在外层增加中括号[ ]

  • 获取key的值的两种方法

    • 1、 点语法，使用范畴仅限于key属性固定，且明确
    • 2、 中括号语法，如果是固定的key就使用字符串方式来设定，如果不固定，直接中括号及变量就可以，例：[ 变量 ]。

数据类型转换

强制转换和隐式转换

数值转字符串

• 类型强制转换 Stiring（）

• 隐式转换方式（没有强制转换，根据运算特征自动转换为字符串） a=a+””

• 隐式转换所使用的转换方法是自动执行String（）;

• . toString()实际上是Object对象的方法，因此，万物皆对象，任何类型都可以调用这个方法

  toString(2)参数必须是2-36之间，否则报错，数字表示转化为指定的进制数，2即为转为二进制

• .toFixed(小数点位数) 转换为字符串，并且保留小数点位数，自动四舍五入

• .toExponential();

• .toPrecision();

数值转布尔值

• 强制转换Boolean()
• 除了0以外所有的数值转布尔都是true，0是false

数值转对象

• 强制转化 Object（）
• 转为数值型对象，数值型对象存储在堆中

字符串转数值

• 强制转换 Number（）；

  • 有一个非数字即为NaN

• NaN 数值类型中的非数值，例：非数值字符串转数值时

• parseInt 转换为整数

  • parseInt（a,2）字符串转换为2进制
  • 截止到第一个非数字

• parseFloat 转换为浮点数

  • parseFloat 不能转换进制

• 隐式转换遵从Number（）转换方法

• 空格问题，两端的空格自动去除，中间的空格会被认定为字符

字符串转布尔

• 仅空字符串转换为布尔值是false，除此之外全部是true
• 空格不是空字符串

字符串转换为对象

• 强制转化 Object（）
• 转换为字符串对象

布尔转数值

• true转为1，false 转为0

布尔转字符

• 转换后就是字符串true和false

布尔转对象

• 转换后就是布尔值对象

任何类型转布尔

• 六种布尔值是false，其他都是true

  • var a="";
  • var b=0;
  • var c=NaN;
  • var d=false;
  • var e=null;
  • var f=undefined;

字符串方法

• str.trim();

  • 清除字符串前后空格,中间不清除

undefined null 转换为字符串、数值

• u转字符串，字符串的u，n相同
• u用Number转数值NaN，n转为0
• u，n用parseInt转全为NaN

运算符

算术运算符

• 加+，减-，乘*，除/，取模（取余）%
• 浮点数运算时，会有误差（计算机精度问题）
• 在算数运算符中前后出现字符串，且使用＋号，则实现字符串首尾相连的方式将内容连接
• 运算过程中没有使用字符串，使用＋符号，其他类型都会转为数值并相加
• 所有类型遇到减乘除取模，都会隐式转换为数值后运算，包括字符串

赋值运算符

• =、+=、-=、/=、*=、%=

• 赋值运算符优先级最低

• <<=左移、>>=右移

  • 计算机先转为二进制，在二进制基础上左移，右侧补0，计算结束后转为十进制输出。右移同理

一元运算符

• ++、–
• 运算优先级很高，但不代表返回优先级高
• 单独使用，结果相同。参与其他一起运算或赋值时，考虑先返回还是先运算后返回。
• 对于++ / – 通常都会直接使用算术运算来处理，也就是会将内容先隐式转换为数值，然后再运算

关系运算符

• < 、> 、<=、 >=

  • 返回布尔值

• == 判断值是否相等、 === 判断值和类型是否相等

  • 以后所有代码必须用===（更严谨）

• 注：undefined==null独立相等，NaN和任何数据（包括它自己）都不相等

• isNaN，将字符串转换为数值后，判断是否是NaN非数值

• = !==

逻辑运算符

• !

  • 逻辑非

    • 取反

• &&

  • 逻辑与

• ||

  • 逻辑或

    • 如果obj转换布尔值是true，直接熔断

XMind: ZEN - Trial Version
undefined
undefined
undefined
undefined
undefined
undefined
undefined
undefined
undefined
undefined