Почему свойства по умолчанию во внешнем файле JS не были перезаписаны пользовательскими свойствами объекта? - PullRequest
Новая
       9

Почему свойства по умолчанию во внешнем файле JS не были перезаписаны пользовательскими свойствами объекта?

0 голосов
/ 08 сентября 2018

У меня есть файл HTML и JS. Если пользователь хочет перезаписать параметры по умолчанию, объявленные во внешнем файле JS, все, что ему нужно сделать, это включить в качестве встроенного сценария следующее: 

<script>
    userControls = { 
        transition : 'fade',
        nextText : 'Next'
    }
</script>

Проблема, с которой я сталкиваюсь, заключается в том, что мой внешний скрипт не выбирает пользовательские настройки и все настраивает по умолчанию. 

var defControls = {
        transition : 'default',
        nextText : 'Next &raquo;'
    };
    var userControls = {};    
    
    // CHECKS FOR userControls
    if (Object.getOwnPropertyNames(userControls).length > 0) {
        var controls = Object.assign({}, defControls, userControls);
    } else {
        controls = defControls;
    }

    console.log(userControls);
    console.log(controls);
    console.log(defControls);
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="styles.css">

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!-- EXTERNAL SCRIPT THAT ACCEPTS USER'S NEW SETTINGS -->
<script type="text/javascript" src="script.js"></script>
</head>
<body>

<!-- SENDS THE NEW PARAMETERS TO script.js -->
<script>
userControls = { 
	transition : 'fade',
	nextText : 'Next'
}
</script>


</body>
</html>

Ответы [ 2 ]

0 голосов
/ 09 сентября 2018

В вашем коде четыре с половиной ошибки:

  1. Вы должны написать встроенный скрипт с кодом: var userControls = {transition: 'fade', nextText: 'Next'}; перед внешним JS-файлом. И не забывайте ; на конце (это половина ошибки).
  2. Строка var userControls = {}; во внешнем файле JS перезаписала настройки в userControls во встроенном скрипте . Я думаю, что вы хотели написать вместо var controls = {};.
  3. var controls = {};, который вы должны написать перед if...else оператором.
  4. Вы пишете console.log(userControls); вместо console.log(JSON.stringify(userControls)); Ваш код пишет только [object Object] в консоли разработчика из IE. Но в Chrome все в порядке.

Решение с исправленным кодом 

<!DOCTYPE html>
<html><head>
<!-- 
<link type="text/css" rel="stylesheet" href="styles.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 -->
<!-- SENDS THE NEW PARAMETERS TO script.js -->
<script type="text/javascript">
var userControls =
{ 
    transition : 'fade',
    nextText : 'Next'
};
</script>

<!-- EXTERNAL SCRIPT THAT ACCEPTS USER'S NEW SETTINGS
 src="script.js" -->
<script type="text/javascript">
var defControls =
{
    transition : 'default',
    nextText : 'Next &raquo;'
};
//THIS WAS THE MISTAKE: var userControls = {}; this line has overwrited the settings

var controls = {};

// CHECKS FOR userControls
if(Object.getOwnPropertyNames(userControls).length > 0)
{
    controls = Object.assign({}, defControls, userControls);
}
else
{
    controls = defControls;
}

console.log('userControls =\n' + JSON.stringify(userControls, null, '\t'));
console.log('controls =\n' + JSON.stringify(controls, null, '\t'));
console.log('defControls =\n' + JSON.stringify(defControls, null, '\t'));
</script>
</head>
<body></body>
</html>
0 голосов
/ 08 сентября 2018

Это потому, что вы вставили выбор пользователя после загрузки вашего файла js.Сначала он проходит через следующий элемент управления

if (Object.getOwnPropertyNames(userControls).length > 0)

, поэтому он всегда оценивается как false.Вот почему вы продолжаете получать значения по умолчанию.Сначала вы должны вставить сценарий выбора пользователя или некоторые асинхронные функции в файл js.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...