!function(){} &JavaScript Logical Operators

js-!function(){}-JavaScript Logical Operators.md

!function(){} & JavaScript Logical Operators

http://taobaofed.org/blog/2015/10/28/try-catch-runing-problem/

!function(){} & IIFE & shorthand IIFE

https://stackoverflow.com/questions/9267289/what-does-function-in-javascript-mean

https://about.twitter.com/zh-hans/resources/buttons#follow

// shorthand/ 替代, 自我调用匿名函数：


!function(){
  // code
}();

//===

(function(){
  // code
})();

(function(){
  // code
}());

https://www.ecma-international.org/publications/standards/Ecma-262.htm

https://sarfraznawaz.wordpress.com/2012/01/26/javascript-self-invoking-functions/

https://javascriptweblog.wordpress.com/2010/07/06/function-declarations-vs-function-expressions/

let x_style = `
    color: #0f0;
    background: rgba(0,0,0,0.5);
    font-size: 2rem;
    border: 1px solid red;
    border-radius: 7px;
`;

let message = `IIFE`;

(function(){
    console.log(`%c message \n`, `${x_style}`, `${message} outer`);
})();

(function(){
    console.log(`%c message \n`, `${x_style}`, `${message} inner`);
}());



!function(){
    console.log(`%c message \n`, `${x_style}`, `${message} !`);
}();


You can also use + instead of !.

+function(){
    console.log(`%c message \n`, `${x_style}`, `${message} +`);
}();


-function(){
    console.log(`%c message \n`, `${x_style}`, `${message} -`);
}();

JavaScript Function Definitions

https://www.w3schools.com/js/js_function_definition.asp

JavaScript Logical Operators

https://www.w3schools.com/js/js_operators.asp

Operator Description && logical and || logical or ! logical not

JavaScript Comparison and Logical Operators

https://www.w3schools.com/js/js_comparisons.asp

JavaScript Bitwise Operators

https://www.w3schools.com/js/js_operators.asp

https://www.w3schools.com/js/js_bitwise.asp

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/in

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Expressions_and_Operators

https://developer.mozilla.org/cn/docs/Web/JavaScript/Closures

https://github.com/ReactiveX/rxjs

JavaScript Event Delegation

https://davidwalsh.name/event-delegate

https://learn.jquery.com/events/event-delegation/

https://javascript.info/event-delegation

https://www.sitepoint.com/javascript-event-delegation-is-easier-than-you-think/

https://www.nczonline.net/blog/2009/06/30/event-delegation-in-javascript/

https://stackoverflow.com/questions/1687296/what-is-dom-event-delegation

https://www.w3.org/TR/DOM-Level-2-Events/events.html

Element.matches()

https://developer.mozilla.org/zh-CN/docs/Web/API/Element/matches

https://davidwalsh.name/datalist

https://www.sitepoint.com/javascript-event-delegation-is-easier-than-you-think/

Array.prototype.indexOf()

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf

indexOf()方法返回在数组中可以找到给定元素的第一个索引，如果不存在，则返回-1。

<input name="frameworks" list="frameworks" />

<datalist id="frameworks">
	<option value="MooTools">
	<option value="Moobile">
	<option value="Dojo Toolkit">
	<option value="jQuery">
	<option value="YUI">
</datalist>

https://davidwalsh.name/datalist

HTML5 classList API

https://developer.mozilla.org/zh-CN/docs/Web/API/Element/classList

div.classList.toggleitem( num);

https://gist.github.com/xgqfrms-GitHub/8f1071b522a6f54316215d6aa37f5706

// div是具有class =“foo bar”的<div>元素的对象引用
div.classList.remove("foo");
div.classList.add("anotherclass");

// 如果visible被设置则删除它，否则添加它
div.classList.toggle("visible");

// 添加/删除 visible，取决于测试条件，i小于10
div.classList.toggle("visible", i < 10);

alert(div.classList.contains("foo"));

//添加或删除多个类
div.classList.add("foo","bar");
div.classList.remove("foo", "bar");

https://davidwalsh.name/classlist

https://davidwalsh.name/window-postmessage

https://developer.mozilla.org/zh-CN/docs/Web/API/Element/matches

https://davidwalsh.name/html5-apis

https://developer.mozilla.org/zh-CN/Add-ons/WebExtensions/API/contextMenus

https://davidwalsh.name/promises

React

https://facebook.github.io/react/tutorial/tutorial.html

https://egghead.io/lessons/react-write-a-higher-order-component-from-scratch

https://egghead.io/lessons/react-learn-how-recompose-optimizes-higher-order-components

HTMLElement.dataset

https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/dataset

HTMLElement.dataset属性允许无论是在读取模式和写入模式下访问在 HTML或 DOM中的元素上设置的所有自定义数据属性(data-*)集。

它是一个DOMString的映射，每个自定义数据属性的一个条目。

请注意，dataset 属性本身可以被读取，但不能直接写入。相反，所有的写入必须是它的“属性”，这反过来表示数据属性。

还要注意，一个HTML data-attribute 及其对应的DOM dataset.property 不共享相同的名称，但它们总是相似的：

在HTML中的一个自定义数据属性的名称以 data- 开头。它只能包含字母，数字和以下字符： dash (-), dot (.), colon (:), underscore (_) - 但不是任何ASCII大写字母（A到Z）。
Javascript 中的一个自定义数据属性的名称是相同HTML属性的名称，但在 camelCase中，没有破折号，点等。

https://davidwalsh.name/html5-apis

https://davidwalsh.name/element-dataset
https://davidwalsh.name/classlist

https://davidwalsh.name/window-postmessage

https://davidwalsh.name/react-state
https://davidwalsh.name/cloudinary-react

https://davidwalsh.name/promises

https://davidwalsh.name/element-dataset
https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/dataset

https://davidwalsh.name/window-postmessage

Node 工程师指南

http://www.scotthasbrouck.com/the-node-engineers-guide-to-stripe

G:\xgqfrms

H:\xyz\webpack2

!function(){} & JavaScript Logical Operators

JS 默认 function(){} 不调用 function_name(); 不会执行, ! 非运算符，可以打破这种限制规则，使其 立即执行定义的函数！

IIFE

/**
 * @description `!function() & IIFE`
 * @author xgqfrms
 * @link https://github.com/gildata/RAIO/issues/192
 */

// ES6
(
    () => console.log(`ES6 IIFE!`, this)
)(this);



// ES5
(
    function () {
        console.log(`ES5 IIFE!`, this);
    }
)(this);


(
    function () {
        console.log(`ES5 IIFE!`, this);
    }(this)
);


function fn() {
    console.log(`ES5 IIFE!`, this);
}(this);

!function fn() {
    console.log(`ES5 IIFE!`, this);
}(this);


!function fn() {
    console.log(`ES5 IIFE!`, this);
}();


!function fn() {
    console.log(`ES5 IIFE!`, this);
}();
// true


!function fn() {
    console.log(`ES5 IIFE!`, this);
};
// false

!function() {
    console.log(`ES5 IIFE!`, this);
};
// false

function fn() {
    console.log(`ES5 IIFE!`, this);
};

fn();

https://gist.github.com/xgqfrms-GitHub/cd117d20b7c087c0de820f6c3b542148

http://taobaofed.org/blog/2015/10/28/try-catch-runing-problem/

bug

console.log(arr.map(word => word[0].toUpperCase() + word.slice(1)));