JavaScript基础知识点(一)

一、JavaScript数据类型

1、概述

JavaScript有六种数据类型。(ES6 又新增了第七种 Symbol 类型的值)

(1)数值(number):整数和小数(比如1和3.14)

(2)字符串(string):文本(比如Hello World)。

(3)布尔值(boolean):表示真伪的两个特殊值,即true(真)和false(假)

(4)undefined:表示“未定义”或不存在,即由于目前没有定义,所以此处暂时没有任何值

(5)null:表示空值,即此处的值为空。

(6)对象(object):各种值组成的集合。

通常,数值、字符串、布尔值这三种类型,合称为原始类型(primitive type)的值,即它们是最基本的数据类型,不能再细分了。对象则称为合成类型(complex type)的值,因为一个对象往往是多个原始类型的值的合成,可以看作是一个存放各种值的容器。至于undefined和null,一般将它们看成两个特殊值。

对象是最复杂的数据类型,又可以分成三个子类型。

(1)狭义的对象(object)

(2)数组(array)

(3)函数(function)

2typeof运算符

1)JavaScript有三种方法,可以确定一个值是什么类型。

  •  typeof运算符
  •  instanceof 运算符
  • .Object.prototype.toString方法

 例如:

typeof 123 // "number"

typeof '123' // "string"

typeof false // "boolean"

3null, undefined 和布尔值

 1)null 表示空值。调用函数时,某个参数未设置任何值,就可以传入null,表示该参数为空。

 2)undefind 表示为定义。

 3)布尔值,代表“真”和“假”两个状态

  下列运算符会返回布尔值:

  • 前置逻辑运算符: ! (Not)
  • 相等运算符:===,!==,==,!=
  • 比较运算符:>,>=,<,<=

  转换规则是除了下面六个值被转为false,其他值都视为true。

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""或''(空字符串)

4、数值

1)整数和浮点数。JavaScript 语言的底层根本没有整数,所有数字都是小数(64位浮点数)。

2)NaN不等于任何值,包括它本身。

5、与数值相关的全局方法

1)parseInt 方法用于将字符串转为整数。

2)parseFloat方法用于将一个字符串转为浮点数。

3)isNaN方法可以用来判断一个值是否为NaN。isNaN只对数值有效,如果传入其他值,会被先转成数值。

4)isFinite方法返回一个布尔值,表示某个值是否为正常的数值。

6、字符串

1)单引号的内部,可以使用双引号。反之亦可。

2)单引号的内部,使用单引号,必须在内部的单引号前面加上反斜杠,用来转义。

(3)双引号内部使用双引号。

例如:

    'Did she say \'Hello\'?'

    "Did she say \"Hello\"?"

  【注:由于 HTML 语言的属性值使用双引号,所以很多项目约定 JavaScript 语言的字符串只使用单引号】

7、对象

1)in 运算符

8、函数

JavaScript 有三种声明函数的方法:

1)function 命令

2)函数表达式

3)Function 构造函数

9、数组

1)遍历数组最好用for

二、运算符

1JavaScript 共提供10个算术运算符,用来完成基本的算术运算。

  • 加法运算符:x + y
  • 减法运算符: x - y
  • 乘法运算符: x * y
  • 除法运算符:x / y
  • 指数运算符:x ** y
  • 余数运算符:x % y
  • 自增运算符:++x 或者 x++
  • 自减运算符:--x 或者 x--
  • 数值运算符: +x
  • 负数值运算符:-x

1.1加法运算符

 (1) JavaScript允许非数值相加

例如:

 console.log(true + true) // 2
 console.log(1 + true) // 2

(2)对象的相加

例如: 

var obj = { a: 1}  obj+2

2、JavaScript 一共提供了8个比较运算符。

  • > 大于运算符
  • < 小于运算符
  • <= 小于或等于运算符
  • >= 大于或等于运算符
  • == 相等运算符
  • === 严格相等运算符
  • != 不相等运算符
  • !== 严格不相等运算符

3、布尔运算符用于将表达式转为布尔值,一共包含四个运算符。

  • 取反运算符:!
  • 且运算符:&&
  • 或运算符:||
  • 三元运算符:?:

4、运算顺序

优先级:优先级高的运算符先执行,优先级低的运算符后执行。

根据语言规格,这五个运算符的优先级从高到低依次为:小于等于(<=)、严格相等(===)、或(||)、三元(?:)、等号(=)

三、语法专题

1、数据类型的转换:强制转换

  1.1 强制转换主要指使用Number()、String()和Boolean()三个函数,手动将各种类型的值,分别转换成数字、字符串或者布尔值。

  •  Number():使用Number函数,可以将任意类型的值转化成数值。
  •  String():String函数可以将任意类型的值转化成字符串。
  •  Boolean():Boolean函数可以将任意类型的值转为布尔值。

   1.2 Boolean的转换规则相对简单:除了以下五个值的转换结果为false,其他的值全部为true。

  • undefined
  • null
  • 0(包含-0和+0)
  • NaN
  • ''(空字符串)

2、错误处理机制

(1)Error 实例对象

例如:

var  err = new Error('错误1');

console.log(err.message) //错误1

JavaScript 语言标准只提到,Error实例对象必须有message属性,表示出错时的提示信息,没有提到其他属性。

(2)原生错误类型

  • SyntaxError对象是解析代码时发生的语法错误。
  • ReferenceError对象是引用一个不存在的变量时发生的错误。
  • RangeError对象是一个值超出有效范围时发生的错误。主要有几种情况,一是数组长度为负数,二是Number对象的方法参数超出范围,以及函数堆栈超过最大值。
  • TypeError对象是变量或参数不是预期类型时发生的错误。
  • URIError对象是 URI 相关函数的参数不正确时抛出的错误,主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。

(3)自定义错误

  function UserError(message){
       this.message = message || '默认信息';
       this.name = 'UserError';
  }

   UserError.prototype = new Error();//继承Error对象
   UserError.prototype.constructor = UserError;

      或者

throw new UserError('出错了')

(4)throw语句

  throw语句的作用是手动中断程序执行,抛出一个错误。

(5)try...catch 结构

  try...catch结构允许在最后添加一个finally代码块,表示不管是否出现错误,都必需在最后运行的语句。

(6)finally 代码块

四、编码风格

1、console.log方法支持以下占位符,不同类型的数据必须使用对应的占位符。

  • %s 字符串
  • %d 整数
  • %i 整数
  • %f 浮点数
  • %o 对象的链接
  • %c CSS 格式字符串

2、debugger 语句 主要用于除错,作用是设置断点

五、JS获取窗口高度和宽度代码

window.innerHeight 浏览器窗口的内部高度
window.innerWidth 浏览器窗口的内部宽度

window.outerheight 返回窗口的外部高度。
window.outerwidth 返回窗口的外部宽度。

Screen 对象属性
screen.availHeight 返回显示屏幕的高度 (除 Windows 任务栏之外)。 screen.availWidth 返回显示屏幕的宽度 (除 Windows 任务栏之外)。 screen.height 返回显示屏幕的高度。 screen.width 返回显示器屏幕的宽度。

六、Jquery实现点击事件的四种写法

1. $(".tab").click(function () {  })

2. $(".tab").on("click",function () {  })

3. $(document).on("click", ".tab",function () {  })

4. 使用<οnclick="">触发函数

posted @ 2020-06-17 14:54  浅笑若梨  阅读(177)  评论(0)    收藏  举报