深挖JavaScript语法一

作者: 吴少在coding | 来源:发表于2017-12-23 18:13 被阅读68次

从今天开始用重新认识JS,毕竟前端是靠JS吃饭的,开始深挖一下细节,在这个过程中也反思了一下,为啥java没学好。果然是基础不牢,地动山摇啊,古人诚不欺我也!

JS的数据类型有哪几种?

以前一直说会JS,却连这个问题没好好搞过,给自己两耳光……

数据类型 名称
1. 基本数据类型(也叫简单数据类型) number string boolean symbol undefined null
2. 复杂数据类型 object
  • 注意,array和function属于object类型;symbol是ES6的内容。

几个大坑

  • 长字符串里面的大坑
    长字符串可以用+连接符,优雅易懂。但是还可以这么写
var longStr = 'agggggg\
bgggggg\
cgggggg\
d'
//结果依然是aggggggbggggggcggggggd

上述代码不报错的前提是\后面不能有除了换行符以外的任何字符,即使一个空格就报错

长字符串的坑.png
  • 字符串的length属性和字符集
    • 字符串的length属性是不可更改的,你爱写啥写啥,length属性不变。
      length属性.png

java的8个基本数据类型:byte short int long float double char boolean
java里面的判断长度的方法只有三个

  • 字符串的length属性
  • 数组的length()方法
  • 集合类的size()方法

  • 字符串的字符集

由于JavaScript引擎(严格说是ES5规格)不能自动识别辅助平面(编号大于0xFFFF)的Unicode字符,导致所有字符串处理函数遇到这类字符,都会产生错误的结果(详见《标准库》一章的String对象章节)。如果要完成字符串相关操作,就必须判断字符是否落在0xD800到0xDFFF这个区间。
替换(String.prototype.replace)、截取子字符串(String.prototype.substring, String.prototype.slice)等其他字符串操作,都必须做类似的处理。

代码如下

function getSymbols(string) {
  var length = string.length;
  var index = -1;
  var output = [];
  var character;
  var charCode;
  while (++index < length) {
    character = string.charAt(index);
    charCode = character.charCodeAt(0);
    if (charCode >= 0xD800 && charCode <= 0xDBFF) {
      output.push(character + string.charAt(++index));
    } else {
      output.push(character);
    }
  }
  return output;
}

var symbols = getSymbols('𝌆');

symbols.forEach(function(symbol) {
  // ...
});
  • JavaScript原生提供两个Base64相关方法。

Base64是一种基于64个可打印字符来表示二进制数据的表示方法。由于2的6次方等于64,所以每6个比特为一个单元,对应某个可打印字符。三个字节有24个比特,对应于4个Base64单元,即3个字节可表示4个可打印字符。它可用来作为电子邮件的传输编码。在Base64中的可打印字符包括字母A-Z、a-z、数字0-9,这样共有62个字符,此外两个可打印符号在不同的系统中而不同。

两个方法
btoa():字符串或二进制值转为Base64编码
atob():Base64编码转为原来的编码

var string = 'Hello World!';
btoa(string) // "SGVsbG8gV29ybGQh"
atob('SGVsbG8gV29ybGQh') // "Hello World!"

这两个方法不适合非ASCII码的字符,会报错。

btoa('你好')
VM1195:1 Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.
    at <anonymous>:1:1

要将非ASCII码字符转为Base64编码,必须中间插入一个转码环节,再使用这两个方法

function b64Encode(str) {
  return btoa(encodeURIComponent(str));
}

function b64Decode(str) {
  return decodeURIComponent(atob(str));
}

b64Encode('你好') // "JUU0JUJEJUEwJUU1JUE1JUJE"
b64Decode('JUU0JUJEJUEwJUU1JUE1JUJE') // "你好"
两个角度来看待 原因
1. 语法规范 变量没有值,就是undefined。事实上,你在console上随便写一个语句,都是undefined
2. 习惯上理解 如果有一个对象,你声明了,但是此时不给他赋值,让他等于null;如果你有一个非对象的变量,你此时不想赋值,就让他等于undefined。

var obj = null,别人一眼就能看出你是想声明一个对象,不过此时不想赋值;var a = undefinded,别人一眼就能看出你是想声明一个非对象,此时不想赋值

  • 对象的key的问题
    对象就是一组“键值对”(key-value)的集合,是一种无序的复合数据集合。
    你用for...in的时候那个顺序的随机的
    大坑来啦……如下代码
var obj = {
   'name': 'wushao', 
   'age': 8}
for (var key in obj){
    console.log(obj.key)
}

你是想打印出'wushao'和8来,结果屁都没有。


key的陷阱.png
  • 注意 [ ]运算符里面必须是字符串,而且是对象的键。这个例子中,key才是字符串,而且是obj的key;你obj.key相当于obj['key'],obj没有这个叫key的键。
    对象的基本结构式{key: value}
    key必须是字符串,valu是那7种 的任意一个。
var obj = {
  ' ': 'frank'
  没问题
}
  • 关于key加不加引号的问题。
    你保证你的key符合标识符规范,可以不加,但是有个默认的引号在上面。如果不符合标识符规范的,必须加引号
    同理,obj[ ]括号里面不符合标识符规范的,必须加引号。
var person = {
  '09a': '我不符合标识符规范,key必须加引号保护,否则就报错',
  name: '我符合标识符规范,引号加不加都可以,反正key一定是个字符串'
}
key的写法.png

-还有啊,对象的每个key-value的结束,一定记得加逗号啊!!!!,能多写不能少写,最新的ES6可以都写逗号,不报错

总之,记住一个公式

obj.name 等同于 obj.['name']

  • 判断某个属性是否声明过
    用下面的公式
if ('a' in window) {
  // 变量 a 声明过
} else {
  // 变量 a 未声明
}

相关文章

  • 深挖JavaScript语法一

    从今天开始用重新认识JS,毕竟前端是靠JS吃饭的,开始深挖一下细节,在这个过程中也反思了一下,为啥java没学好。...

  • 深挖JavaScript语法二

    JS一定要抠细节,逻辑性。我们这次探讨 内存 的问题、一个IE的BUG以及深拷贝和浅拷贝,和typeof运算符的小...

  • JavaScript语法

    JavaScript语法 一、JavaScript的组成 完整的JavaScript是由ECMAScript(语法...

  • JSON 语法

    JSON 语法是 JavaScript 语法的子集。 JSON 语法规则 JSON 语法是 JavaScript ...

  • 2018-11-05

    01javascript语法规范 javascript语法...

  • js_api

    JavaScript substring() 方法 语法 JavaScript slice() 方法 语法 Jav...

  • JavaScript-01

    A 什么是JavaScript JavaScript 定义JavaScript JavaScript基础语法 常用...

  • JS----字符串、定时器、变量

    Javascript组成 1、ECMAscript javascript的语法(变量、函数、循环语句等语法) ...

  • JavaScript语法教程学哪些知识点?

    JavaScript语法教程学哪些知识点?JavaScript语法需要学计算机基础、Javascript变量、数据...

  • JavaScript01_基础知识

    一、基本语法 基本语法 JavaScript的每个语句以;结束,语句块在花括号内{...}。 JavaScript...

网友评论

    本文标题:深挖JavaScript语法一

    本文链接:https://www.haomeiwen.com/subject/zgeqgxtx.html